перейти к содержанию
Главная » Веб-дизайн » Понимание политики безопасности контента веб-сайта (CSP)

Понимание политики безопасности контента веб-сайта (CSP)

Последнее обновление: октябрь 11, 2026

Безопасность веб-сайта — это не только брандмауэры и надежные пароли. Значительная часть реальных атак происходит внутри браузера посетителя, где внедренные скрипты могут украсть данные или перехватить сессию.

Сюда также входит защита данных в Интернете и настройка защиты от вредоносного кода или других атак с внедрением кода.

В этой статье основное внимание уделяется мерам безопасности — политике безопасности контента.

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

Продолжайте читать, чтобы узнать больше об этой функции безопасности и о том, как ее настроить.

Что такое политика безопасности контента веб-сайта?

Политика безопасности контента (CSP) — это стандарт безопасности. Она обеспечивает защиту веб-сайтов и приложений от различных атак, таких как межсайтовый скриптинг (XSS). CSP — это заголовок HTTP-ответа, который повышает безопасность веб-страниц в основных современных браузерах.

Заголовок политики безопасности контента ограничивает источники контента (например, сценарии и изображения), которые веб-страница может загружать и из которых она может быть загружена. 

Источник

Если вы используете заголовок HTTP-ответа Content Security Policy (CSP) в браузере, который его не поддерживает, браузер его игнорирует. Кроме того, по умолчанию используется политика одного источника (еще одна форма защиты от вредоносного кода). Однако браузер все равно может работать с сервером, поддерживающим CSP, и наоборот.

Обратите внимание, что CSP — это дополнительный уровень безопасности от различных типов уязвимостей. Ключевое слово здесь «дополнительно». Другими словами, вы все равно должны защитить свою веб-страницу, используя другие меры безопасности. 

Стоит также отметить, что CSP не предотвращает атаки на вашу веб-страницу. Он эффективно обнаруживает эти атаки и значительно снижает риск их использования. 

Важность политики безопасности контента веб-сайта

Вы используете заголовок политики безопасности контента (CSP), чтобы контролировать источники контента, которые может загружать ваш сайт. Внедрение CSP может использоваться на любом веб-сайте, будь то сайт электронной коммерции или блог. 

Это помогает:

Смягчение XSS-атак

Мы уже упоминали, что CSP может помочь смягчить XSS-атаки. Но что именно это такое и как CSP может помочь? 

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

CSP защищает от XSS-атак, ограничивая встроенные сценарии. Это также предотвращает загрузку вашей веб-страницы удаленных сценариев, то есть сценариев с произвольных серверов.

CSP также защищает ваш сайт от XSS-атак, контролируя отправку HTML-форм. Таким образом, даже если посетители делятся данными кредитной карты для покупки продукта или заполняют сертификаты членства в ООО онлайн, их данные остаются защищенными. По сути, CSP ограничивает то, куда отправляются данные из этих форм. Кроме того, CSP ограничивает тег объекта HTML.

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

В конечном итоге, благодаря CSP, злоумышленники не могут внедрить вредоносные сценарии.

Предотвращение кликджекинга

Хотя CSP был в первую очередь введен для смягчения поверхности атаки XSS-атак, он также был разработан для обеспечения защиты от атак веб-приложений, таких как кликджекинг.

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

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

Раньше стандартной защитой от кликджекинга был заголовок X-Frame-Options. Директива frame-ancestors из CSP (введенная в CSP уровня 2 и являющаяся частью текущего проекта уровня 3) выполняет ту же задачу, но с большей гибкостью, и современные браузеры отдают ей приоритет. Многие сайты по-прежнему отправляют оба заголовка для старых браузеров.

CSP уровня 2 содержит директиву frame-ancestors , предназначенную для защиты от кликджекинга . Директива frame-ancestors указывает URL родительской страницы, которой разрешено встраивать веб-страницу во фрейм, iFrame или объект в текущем ресурсе.

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

content-security-policy: frame-ancestors 'self' '\*.internxt.com' ;      

Также можно использовать директиву frame-ancestors вместе с директивами default-src и script-src для снижения риска атак типа clickjacking.

Какие еще атаки предотвращает CSP?

CSP также может обеспечивать использование HTTPS. Перечислите в своей политике только источники с префиксом https:// и добавьте директиву upgrade-insecure-requests, чтобы браузер автоматически загружал оставшиеся ресурсы с префиксом http:// по HTTPS. (Более старая директива block-all-mixed-content устарела, поскольку браузеры блокируют или обновляют смешанный контент самостоятельно.)

Другие уязвимости, которые можно устранить с помощью CSP, включают:

  1. Динамический код Javascript с использованием eval()
  2. Неназначенный встроенный Javascript в tags
  3. Динамический CSS с использованием CSSStylesheet.insertRule()
  4. Неназначенные встроенные операторы CSS в tags

Как настроить политику безопасности контента

Настройка CSP — важный шаг в защите вашего веб-приложения. Вы можете настроить защиту CSP для своего веб-сайта тремя способами.

Заголовок Content-Security-Policy

Этот метод включает отправку HTTP-заголовка ответа content-security-policy с веб-сервера. Например;

Политика безопасности контента: …

Убедитесь, что вы настроили заголовок во всех ответах HTTP.

Мета-теги Content-Security-Policy 

В тех случаях, когда вы не можете использовать заголовок HTTP-ответа CSP, вы все равно можете настроить CSP для своего веб-сайта, используя метатег «HTTP-equiv» в HTML-файле. Вот как выглядит строка метатега CSP:

Этот метод накладывает ограничения на используемые функции CSP. Например, вы не можете использовать защиту от фреймирования или конечную точку для регистрации нарушений CSP.

Заголовок Content-Security-Policy-Report-Only 

Этот заголовок указывает браузеру сообщать о нарушениях политики без блокировки чего-либо. Отчеты отправляются на конечную точку, которую вы определяете с помощью директивы report-to (в паре с заголовком Reporting-Endpoints). Более старая директива report-uri устарела, но по-прежнему широко поддерживается, поэтому многие сайты пока включают обе. Например;

content-security-policy-report-only: script-src 'self'; 

отчет-в конечную точку-отчетности csp 

Основное отличие этого заголовка от обычного заголовка HTTP-ответа CSP заключается в том, что первый не обеспечивает соблюдение политики. Однако браузеры позволяют сайтам использовать как заголовок «content-security-policy», так и заголовок «content-security-policy-report-only».

Детали реализации

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

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

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

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

Но если вы готовы принять этот вызов, давайте подробнее рассмотрим директивы CSP, упомянутые в предыдущих разделах, которые помогут вам разобраться в этом аспекте вашего сайта:

Получить директивы 

Вы включаете директивы выборки в поле заголовка ответа, чтобы указать места, которым ваш браузер может доверять, и из которых можно загружать типы ресурсов. Большинство директив fetch возвращаются к default-src. Это означает, что если какая-либо директива выборки не указана в поле заголовка ответа, значения директивы берутся из директив по умолчанию. 

Примеры директив fetch включают «child-src», «font-src» и «img-src». 

Директивы документа

Директивы документа в поле заголовка ответа CSP сообщают браузеру свойства документов, к которым применяется политика. 

Например, директива «base-URI» ограничивает URL-адреса, которые может использовать базовый элемент документа. Другой пример — директива «sandbox», которая ограничивает действия, которые может выполнять страница. Директивы документа не используют в качестве резервного варианта директивы default-src. 

Навигационные директивы

Директивы навигации определяют, куда документ может направлять пользователей или данные. Основные из них — «form-action», ограничивающий URL-адреса, на которые могут отправляться формы, и «frame-ancestors», определяющий, какие сайты могут встраивать вашу страницу. (Предложенная директива «navigate-to» была исключена из спецификации и так и не была включена в браузеры.)

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

Политика тестирования

CSP может работать против веб-сайта, если он настроен неправильно. Вот тут-то и приходит на помощь тестирование.

Режим «только отчет» — эффективный метод проверки правильности работы CSP. Режим «Только отчеты» предоставляет информацию о количестве нарушений CSP, которые могли бы произойти, если бы политика применялась, но ничего не блокирует.

Этот метод тестирования помогает владельцам веб-сайтов понять, где их политика, скорее всего, потерпит неудачу. В результате они могут настроить его соответствующим образом.

Для проверки CSP веб-сайта в режиме только отчета доступны различные инструменты. Одним из самых популярных является CSP Evaluator. 

Этот инструмент позволяет вам ввести URL-адрес. Затем инструмент проверяет, существует ли заголовок CSP. Он также покажет, правильно ли настроен CSP. В то же время он анализирует политику, отмечает потенциальные проблемы и подсказывает, как ее улучшить. 

На следующем снимке экрана показаны некоторые предложения инструмента:

Источник

Вы также можете использовать сканеры, такие как MDN HTTP Observatory (преемник Mozilla Observatory) или CSP Tester. Они работают аналогично CSP Evaluator: проверяют ваши заголовки, оценивают вашу политику и рекомендуют улучшения.

Расширения, такие как Google CSP Tester и CSP Debugger, также могут помочь вам протестировать ваши CSP-пакеты. 

Они отслеживают текстовый и видеоконтент, загруженный на веб-страницу, и источники его получения, выявляя любые нарушения CSP.

Эти расширения доступны как для браузеров Chrome, так и для Firefox. Их можно использовать для тестирования, отладки и проверки вашего CSP на вашем веб-сайте. Они также могут создавать отчеты об эффективности (или ее отсутствии) CSP.

Рекомендации и запреты при использовании CSP

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

Итак, вот несколько правил:

Используйте политику на основе одноразового кода (nonce) с параметром 'strict-dynamic'. При такой настройке запускаются только скрипты, содержащие правильный одноразовый код nonce (или хеш), и любые скрипты, которые они загружают, автоматически получают доверие. Это делает строгую политику практичной для сайтов, использующих менеджеры тегов или динамически загружающих скрипты, без необходимости поддерживать длинный список разрешенных доменов.

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

Однако использование встроенного кода не рекомендуется. Директива `inline` разрешает использование встроенных скриптов и стилей в HTML-коде. Это рискованно, поскольку позволяет хакерам внедрять вредоносный код в ваш контент. Вместо этого используйте атрибуты `nonce-value` и `hash-value`, чтобы разрешить использование встроенных скриптов и стилей из надежных источников.

Не используйте также директиву 'eval()'. Директива 'eval()' разрешает выполнение динамически сгенерированных скриптов. Она может обойти CSP и выполнить произвольный код, что представляет собой существенный риск для безопасности.

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

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

Добавление CSP на сайт WordPress

В WordPress вы можете отправить заголовок с вашего веб-сервера (через файл .htaccess Apache или конфигурацию Nginx), с CDN, например Cloudflare, используя правило заголовка ответа, или с помощью плагина безопасности, поддерживающего пользовательские заголовки. Какой бы метод вы ни использовали, помните о следующих моментах:

  • Запуск в режиме только для создания отчетов. Темы оформления, конструкторы страниц, скрипты аналитики и платежей загружаются из множества источников, и строгая политика может привести к сбоям в работе форм оформления заказа или самих форм уже в первый день.
  • Обратите внимание на кэширование страниц. В каждом ответе должен быть разный одноразовый код (nonce). Если кэширование всей страницы предоставляет всем один и тот же HTML-код, одноразовые коды перестают быть секретными, поэтому используйте хеши или список разрешенных страниц для кэшированных страниц, либо генерируйте одноразовые коды на границе CDN.
  • Проверка после обновления. Для новых плагинов и встраиваемых сторонних элементов часто требуются новые источники, поэтому после внесения существенных изменений перепроверяйте отчеты о нарушениях.

Примеры политики безопасности контента

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

  • Чтобы настроить заголовок CSP, чтобы разрешить использование сценариев, CSS, AJAX и изображений из текущего источника без загрузки других ресурсов;

Content-Security-Policy: default-src 'none' ; script-src 'self' ; connect-src 'self' ; img-src 'self' ; style-src 'self' ; frame-ancestors 'self' ; form-action 'self' ;  

  • Настроить умеренно строгую политику в поле заголовка ответа; 

script-src 'nonce-r4nd0m' 'strict-dynamic' ;

object-src 'none' ; base-uri 'none' ;

  • Конфигурация CSP для строгой политики блокировки;

script-src 'nonce-r4nd0m'

object-src 'none' ; base-uri 'none' ;

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

Вы можете узнать больше об атрибутах nonce для CSP на MDN. Вы также можете получить информацию из этого справочного руководства.

В заключение

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

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

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

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

Предпочитаемый источник Google

Вам понравилось это руководство? Смотрите больше подобных материалов. Webnus в гугле

Добавить Webnus Если вы выберете наш источник в качестве предпочтительного, наши статьи будут чаще появляться в вашей подборке «Главные новости Google».

Добавить в качестве предпочтительного источника

Масуд Варасте

Масуд Варасте — писатель. Webnus Обладая более чем 10-летним профессиональным опытом в написании текстов, он с самого начала увлекался писательством, а со временем к его увлечению добавилась третья составляющая: WordPress. Сегодня он пишет практические руководства по темам и плагинам WordPress. WooCommerceОн специализируется на хостинге, безопасности и производительности веб-сайтов, превращая технические темы в понятные пошаговые рекомендации, которым владельцы сайтов могут следовать на практике. Он постоянно обновляет свои статьи по мере развития WordPress и его экосистемы. Свяжитесь с Масудом в LinkedIn.