Первоклассные услуги по продвижению и раскрутке сайтов

Content Security Policy: защищаемся от подмены контента

Опубликовано: 2016/07/08Рубрика:
Полезные материалы
Комментариев: 0
Просмотров: 928

Nastroyka_kontent_security_policy

Иногда рядовые пользователи, посещая ваш сайт, могут сталкиваться с навязчивой рекламой в браузере сомнительного характера (контент 18+, казино, заработок в интернете по 1000$ в день и т.п.).Происходит это из-за вируса на компьютере посетителя. В целом в этом виноват сам пользователь, однако, из-за ухудшения поведенческих факторов поисковые системы могут ощутимо понизить ваш сайт в выдаче.

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

Пример отображения рекламы на сайте Yandex

Чтобы избежать данных проблемы следует воспользоваться Content Security Policy. Инструмент защищает посетителей от вирусных атак на вашем сайте, показывая браузеру, откуда можно загружать данные, а какие источники нужно забанить. CSP сейчас поддерживают практически все современные браузеры. Узнать поддерживает ли ваш браузер CSP вы можете здесь.

План по настройке

  • Задаем параметры CSP

  • Подключение параметра на вашем ресурсе

  • Диагностика возникающих ошибок и их решение

Анализируем трафик

Для того, чтобы указать параметры для CSP, в первую очередь стоит выяснить откуда и куда уходит наш трафик.

  • Подставная контекстная реклама

  • Java Script или JQuery

  • Онлайн проигрыватели (Youtube, Ru-tube и т.д.)

  • Картинки со сторонних фотохостингов

  • Различного рода виджеты и медиафайлы (в основном реклама социальных сетей)

Параметр для CSP с помощью основных и вспомогательных правил (команд), рассмотрим их далее.

Основные правила CSP

  • default-src – доверенная ссылка, т.е. домен и поддомен нашего сайта

  • object-src – объекты по типу Youtube плеера и прочая медиа составляющая, содержащая Flash код

  • frame-src – фреймы

  • style-src – допустимый CSS код

  • report-uri – адрес, куда будут отсылаться отчет об ошибках и прочий фидбек

  • script-src – скрипты с внешних источников

  • font-src – используемые шрифты

  • img-src – разрешенные картинки

  • media-src – медиа контент

  • connect-src – websocket (протокол TCP-соединения)

Вспомогательные команды:

  • none – запретить (или отсутствие какого-то параметра)

  • self – ссылка только на сам источник без поддоменов

  • unsafe-inline – доступ к внешнему JS и CSS коду

  • unsafe-eval — доступ к eval

Теперь нам нужно обратиться к  коду нашего сайта и задать параметры для CSP.

Создание первого параметра для Content Security Policy

Задавать параметры для CSP можно в ручном режиме, комбинируя команды, но существует более удобный способ — расширение для google chrome. CSP Tester — благодаря данному расширению вы быстро разберетесь в синтексисе CSP и можете протестировать все в бразуере без заливки на сервера сайта.

Скачиваем расширение и устанавливаем. После чего указываем адрес сайта и ставим галочку в поле “Active”. Далее открываем наш сайт и смотрим на возникающие ошибки, если какой-нибудь участок кода отображается неверно, стоит предоставить полный доступ к источнику (*.istochnik.ru). Для того, чтобы загрузить изображения со сторонних источников, следует воспользоваться кодом img-src*, а для Java скриптов используйте команду ‘unsafe-inline’ . Более подробную инструкцию о синтаксисе CSP вы можете найти здесь.

Подключение параметров на сайте

После того, как мы убедились в работоспособности параметров, отключаем расширение и подключаем CSP к сайту. Вставляем следующий код между тегами <head></head> в коде сайта:

<meta http-equiv=»Content-Security-Policy» content=»Здесь указываем наш параметр» />

Однако данный способ поддерживают не все сайты, поэтому ищем директорию .htaccess в корне нашего сервера и прописываем в нем:

<ifModule mod_headers.c>

Header set Content-Security-Policy «Наш параметр»

< /IfModule>

Воспользуемся консолью разработчика в браузере (CTRL+SHIFT+C ИЛИ CTRL+U) и проверяем, работают ли заданные параметры. В случае успеха мы увидим такую картину:

Заключение

Content Security Policy может существенно повысить средние поведенческие факторы сайта, особенно в игровых нишах или download тематике, и существенно повысит качество вашего сайта для пользователей, которые подхватили нежелательное ПО для своего ПК.

Рейтинг статьи:
1 Звезда2 Звезды3 Звезды4 Звезды5 Звезд (5,00 из 5 на основе 1 оценок)