Как запретить выделение контента в браузерах, универсальное решение

« Предыдущая запись
 
  Следующая запись »
 

На некоторых сайтах, особенно сильно посещаемых, иногда возникает вопрос, что как-то надо защитить ваш авторский текст от копирования. Как бы банально (скорее пафосно – прим.ред.) это ни звучало, но, по некоторым оценкам, 90% пиздильщиков воров контента можно отфильтровать всего навсего запретив браузеру выделять текст на странице. В данной статье я предложу довольно простой и универсальный метод на javascript, найденный мной на каком-то сайте, где он использовался. Некоторые основы этого вопроса советую почитать по ссылке.

Итак, смотрим код.

<body id="noselect">
    Любой контент, любая разметка, в общем всё, что надо.
    <script type="text/javascript">

        function disableSelection(target){
            if (typeof target.onselectstart!="undefined")
               target.onselectstart=function(){return false}
            else if (typeof target.style.MozUserSelect!="undefined"
               target.style.MozUserSelect="none"
            else target.onmousedown=function(){return false}
            target.style.cursor = "default"
        }
        if (document.getElementById("noselect")) {
            disableSelection(document.getElementById("noselect"));
        }
    </script>
</body>

Установка его проста:

  1. Прежде всего выберите элемент, который нельзя будет копировать, и задайте ему идентификатор noselect (по нему javascript найдёт элемент, которому надо отключить выделение). В данном случае это тег body, то есть вся страница.
  2. Затем перед закрывающим тегом вашего элемента (в данном случае body) поместите скрипт из листинга [строчки 3-15].

Скрипт также прост как и его установка. Созданная нами функция disableSelection обрабатывает тот блок, который мы выбрали (которому дали соответствующий идентификатор), при помощи событий onselectstart, onmousedown или при помощи добавления стиля -moz-user-select, работающего в огнелисе.

У скрипта есть два минуса. 1) Если мы отключим для выделения какую-то часть страницы, то начав выделение в других частях страницы, можно будет в конце выделить и то, что отключено для выделения. Именно поэтому скрипт лучше всего использовать для тега body. 2) Нажатие ctrl+a выделит весь текст на страницы, без вариантов. Однако этот вариант устраняется написанием доп.функции, про которую можно вычитать в статье, на которую дана ссылка выше.

Для справочки – для WordPress есть плагин с названием WP-CopyProtect, который… в общем понятно что делает=).

,

1 звезда2 звезд3 звезд4 звезд5 звезд (голосов: 6, средний: 4.83 из 5)
Понравилась статья или журнал? Подписывайся на продолжение!
Отзывов: 35 на запись

"Как запретить выделение контента в браузерах, универсальное решение"

  1. Отличное решение!
    Можно запретить вывод контекстного меню
    Ctrl+C тоже не работает в таком случае :)

    document.oncontextmenu = test;
    //запрет на выведение контекстного меню
    function test() {
    return false
    }

  2. да, действительно, отличное дополнение!
    в принципе тогда по большому счёту единственный способ сохранить текст – сохранить страницу и из кода html выдирать текст.
    хотя конечно можно файнридером ещё, но это уже совсем правда=)

  3. Спасибо большое!!!!
    облазила весь инет в поисках решения и вот наконец-то мои поиски были вознаграждены! Это единственный скрипт, который работает, как заявлено! Кстати, CTRL+A тоже не работает ни в одном из моих браузеров (тест на Опере, Мозилле, ИЕ и Сафари)
    Спасибо Вам огромное, неведомый друг!!

  4. У скрипта есть два минуса – - а есть еще один минус-
    но это зависит наверное от браузера….
    напр в Опере (в ИЕ 6 – работает нормально) – если есть ввод данных в input-е – то вы не сможете вставить текст…, напр, при написании коментариев…

  5. 2Sabrina. Пожалуйста, рад что оно оказалось полезным =)

    2Алекс. Имеется в виду вставка через ctrl+v?

  6. Честно говоря все эти приблуды бесполезны.

    В примере одного кода, который надо выдрать – сохраняем страницу,
    открываем на редактирование, убираем индетификатор, сохраняем, открываем в браузере заново из файла. Вуаля )

    Если кто-то парсит страницы скриптами – вообще бестолку такие защиты.

    Реально спасет только от полностью неосведомленного пользователя.
    Но такому и контекст ваш врядли особо будет нужен )

  7. понятное дело, что заглянув в код можно взять что угодно и тут ничего не спасёт. но! есть те кто это не знает, и есть те кто знает, но кому просто впадлу куда-то лезть. причём первых гораздо больше. может не 90%, но 75% точно это отпугнёт в плане постоянного использования.

    а так ясно, что если кому-то припрёт переть все тексты, то он это сделает обходными путями без вопросов =)

  8. Фаирбагом все можно вытащить

  9. Opera 10.61. Текст без проблем выделятся по Ctrl+A. А потом без проблем копируется по Ctrl+C. Увы!!!!

  10. Хотя в IE 8 и Firefoxe 3.6.8 решение, безусловно, работает.

  11. Я уже писал в недостатках скрипта про ctrl+a. надо функцию просто немного дописать, чтобы запретить нажатие этих клавиш. линк на статью есть выше.

  12. Помоему нет смысла в этих фичах, например в тойже Опере ява скрипты отключаются одним клиеом и защита уже бесполезна, лучше сделать при попытке вызова контекстного меню что-то типа алерта с месагой, что ссылка на источник обязательна, ведь всеравно захотят скопируют (((

  13. Это да, в принципе можно просто сохранить страницу на комп и тупо код посмотреть. Но не все пойдут на эти ухищрения, тому кому это относительно не надо, не будут заморачиваться (особенно если весь контент надо упереть и его много), а мы выиграем в сео.

    а вот ссылка на источник в инпутах – вещь хорошая, факт

  14. Отлично, для joomla тоже помогло. А то jsimple content protection работает только в Гугл Хроме. А твой скрипт во все браузерах, спасибо

  15. Рад был помочь!

  16. А вот что-то новенькое… наткнулся на сайт nocopypaste.com обещают защищать текстовый контент и отдаваться ПС. У кого какие мнения на сей счет? p.s. Зарегистрировался там.. вроде все красиво, текст отдается на флеше но флэш зашифрован и разрабы божатся что текста в флеше нет… какой-то у них там технология. А ну и бесплатно это все :)

  17. хммм, действительно что-то новенькое.
    хотя, мне кажется, если кому-то нужен будет текст, он найдёт способ его спионерить =) а защита от дурака и жабаскриптовская сойдёт.
    к тому же, имхо, сайт надо либо целиком на флэше делать, либо без него вообще, используя лишь жкьюри там, прототайп, ну, или на вкус кому что =)

  18. зачем в крайности сразу типа весь сайт на флэш загонять?? я так понял удобно если идет статья или обзор, выкладывать в нормально в виде анонс, теши и пр. а если пользователь хочет почитать целиком, то подкладывать ссылочку с этого сервиса…

  19. не, я не про это. просто если все тексты будут на флэше, то это не айс. а вдруг там у кого проблема с флэшом – не прочитает и всё, минус один. где-то такая тема неактуальна, например на сайтах проггеров, у которых всегда всё есть, а вот типа магазины или ещё чего – точно не айс. да и вопрос индексации ещё – пока поисковики вроде текст из флэша не читают?

  20. АГА! а текст то индексируется из их темы… загляни в исходник… там он есть.. только помешан сильно :) ) в их админке есть даже настройка как сильно мешать… для параноиков :) а вот у кого не запускается флэш…это конечно уже клиника. у меня даже на телефоне работает нормально!

  21. ммм, вижу-вижу. правда насколько я знаю поисковики любят когда текст адекватный читабельный, а не просто набор релевантных фраз =) конечно, может тема спорная, но я бы не стал рисковать своим сайтом.
    а на тему флэша – тут всякое бывает. у меня один раз тема была в хроме, что часть флэша работало через задницу, хотя стояла последняя версия. думал установить заново, а он как бы сам качает при обновлении и так просто обновить – фиг. так что хз хз =)
    вообще мне думается, что при дальнейшем развитии хтмл5 и цсс3 надобность флэша будет хорошо уменьшаться.

  22. выкинул хром и пользую SRW Iron ;) html5 – сыроват…. а поисковикам пофигу… я не могу представить поиск более чем по целому предложению из текста… в общем на запрос в поисковике фразы “Однако сейчас мы с гордостью представляем новый проект, который действительно может называться” выдало первые две ссылки первую страницу их сайта, а второй результат – защищенный контейнер.. т.е. нормально оно проиндексировало! проверь сам …

    p.s. а в чем риск-то?

  23. надо заюзать=)
    сыроват и не только он, а ещё и браузеры, которые за ним не очень поспевают

    хз, так как я слышал такую тему, что не ровен час, когда сайты, у которых текст такой, больше для машины написан, чем для человека, будут по позициям сильно снижаться. да и вообще такая тема уже сейчас есть. может этот пример с флэшом и не попадёт под это и всё нормально, но как-то есть сомнения на этот счёт

  24. нууу…… если думать обо всем что могло бы произойти….. можно сломать голову :) ) пока тема работает, живая…. а дальше будем жить и поглядеть. обратно в html загнать тексты делов на 5 минут…

  25. ну главное чтобы совсем не слететь из-за этой темы. а так да. можно выкрутиться=)

  26. а чего слетать-то?? типа ПС не пофигу в каком порядке предложения идут?? это и не каждый человек отследить-то сможет :)

  27. ну может ей и пох, а может и не пох, или пока не пох. если пох, оно и хорошо, конечно =)

  28. JavaScript отключаем и досвидос. Правда нубы об этом не догадаются

  29. ну да. да и все юзабильные интерфейсы из-за этого могут пострадать. но все их делают и это нормально, так что вопрос включённости отключённости дело такое =)

  30. Выключаем выполнение javascript в браузере и копируем что хотим!!!

  31. И в исходный код залезть можно, проблемы нет. Кому реально надо – тот сопрёт, а кому пофиг откуда переть – от не станет заморачиваться и возьмёт в другом месте.

  32. Спасибо за скрипт – как раз то что нужно, очень пригодилось, для сохранения внешнего вида сайта – который искажался при выделении!

  33. Александр Шуйский
    01/03/2012 at 22:51 Постоянная ссылка Цитировать

    для таких дел оно вообще в кассу, так что всегда пожалуйста =)

  34. поставил данный скрипт, так в опере теперь даже курсор не ставится что бы написать ник.. на сайт не возможно попасть через Оперу)))) Что делать?

  35. Александр Шуйский
    11/03/2012 at 17:17 Постоянная ссылка Цитировать

    снести нафиг эту оперу =)
    а серьёзно – хочу пример

Добро пожаловать, коллега! Вы можете оставить свой отзыв:





Допустимые XHTML-теги:

<a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <strike> <strong>

Подписка на комментарии