Запрет копирования текста на сайте

880

Эта тема уже заезжена в интернете вдоль и поперек, поэтому я ее хотел бы поднять с той точки зрения, нужно ли это вам? Хотя и пример запрет на копирование текста мы тоже наглядно разберем.

Товарищ, загляни ко мне в код

Начнем с того, что те, кто действительно будут копировать ваш контент – это не обычные пользователи. Обычно это боты, парсеры и т.д., т.е. продвинутые программисты и вы действительно думаете, что методы для обычных пользователей вас спасут? Но бывают случаи, когда на ваш сайт заходит и более продвинутый пользователь и возникает желание скопировать какой-нибудь отрезок текста, а у него это не получается и что тогда? А ведь все и норовит на то, чтобы заглянуть в код страницы. Поэтому смысла в этом ограничении не вижу, ну если только вы хотите, чтобы кто-то лишний раз поковырялся в коде вашего сайта.

Запрет на копирование текста на сайте:

Многие пользователи, как, к примеру, и я, читая очередную статью могут просто водить по тексту, выделяя его мышкой, а если у вас стоит блок события по выделению, то это реально напрягает. Еще жуть как не люблю, когда ставят этот плагин расшаривалок социальных сетей. Ну зачем это нужно? Создает ужасный дискомфорт. Сидишь просто выделил текст, а тебе вылазит каждый раз блок поделиться с иконками всех социалок. В общем, если я вас не переубедил, усложняйте себе жизнь дальше!

Запрещаем выделение CSS

Есть замечательное свойство user-select с помощью которого мы сможем запретить пользователю выделить текст, а отсюда и скопировать его. Вот решение для всех браузеров:

.notForCopy { 
  -webkit-user-select: none; /* для Chrome
  -moz-user-select: none; /* для Firefox 
  -ms-user-select: none; /* для IE 10+ 
   user-select: none; 
}

Это самый простой и самый быстрый пример. Достаточно прописать свойства к определенному классу и все готово.

Вешаем действия на события Javascript

Итак, здесь у нас гораздо больше вариаций для выполнения поставленной задачи. Можно немного покреативить, но самый простой способ – это предотвращать вызов контекстного меню(клик правой кнопки) либо выделение текста левой клавишей мыши. На все это необходимо повесить обработчик с возвращением значения false. Выглядеть это будет примерно так:

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

Либо сразу добавлять, что ни есть хорошо, к самому элементу обработчик:

<p oncontextmenu=”return false;”>этот текст нельзя будет скопировать</p>

В коде js у нас гораздо больше возможностей, поэтому мы также сможем запретить выделение:

element.ondblclick = function(){return false;}
element.onselectstart = function(){return false;} 
element.onmousedown = function(){return false;}

Тут мы отслеживаем сразу несколько событий – двойной клик, начало выделения и обычный клик мыши. Можем немного подшутить над пользователем, кстати только ради этого я и вижу смысл в этой затее:

element.onselectstart = function(){alert (‘Но-но-но! Ты что собрался делать?’); return false;}

Но повторюсь еще раз, это лишь несколько решений, которые для меня кажутся бессмысленными. Можно еще отслеживать клик и добавлять в буфер ссылку на источник, можно текст перебивать блоками div или span или вообще забивать невидимыми для визуального режима каракозяблами, но делая его сложным для копирования через код страницы. Все это можно сделать, возникает только вопрос, а нужно?

Тем, кто хочет скопировать текс – он это сделает любым способом, потому что он знает эти методы.

7


не скупись ;-) ставь лайк
Подписка на обновления:
Автор блога Рябухин Максим

Я фрилансер веб-разработчик. Последние несколько лет занимаюсь версткой и веб-программированием на PHP и Javascript. Если вам понадобится помощь с блогом Wordpress, либо в создании любой сложности и любым дизайном сайта, я всегда рад помочь с версткой, либо отдельными разработками. Обращайтесь ко мне за моими услугами.

связаться

Вместе с этим советую почитать:

Оставьте комментарий

у меня есть сайт
;-) :| :x :twisted: :smile: :shock: :sad: :roll: :razz: :oops: :o :mrgreen: :lol: :idea: :grin: :evil: :cry: :cool: :arrow: :???: :?: :!:

комментариев: 7
  • MrVigner

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

    Ответить
    • Галина

      MrVigner, Ой как ты всех обдурил?!))) Меня лично это бесит точно так же как и запрет копирования!

      Ответить
      • MrVigner

        Галина, за все приходиться платить) Написал я текст потратив на это время и силы, а какой-то школьник хочет просто скопировать текст и выдать его за свой поменяв название сайта в статье. Это нарушения авторских прав, так что ссылки оставшийся в тексте — минимальная плата. Учитесь уважать чужой труд, а не бесится :-)

        Ответить
  • Bogutskiy

    Как же надоели воришки контента… С фразой про копирование согласен)
    Я добавляю свои тексты в оригиналы яндекс и гугл.

    Ответить
    • Максим Рябухин

      Bogutskiy, аналогично ;-)

      Ответить
    • Владислав

      Bogutskiy, у вас воруют? У меня ни разу за 2 года не воровали :C
      Даже обидно как-то, хотя блог более-менее популярен.

      Ответить
      • Максим Рябухин

        Владислав, даже парсят без разбора, был в шоке, но моя личная статья авторская валялась на каком-то под минусинском сайте, бывает и такое.. :sad:

        Ответить
показать все


Как вам новый дизайн сайта?

Курс Бери и Зарабатывай!

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

Узнать больше!

Курс по соц. сетям