Как работает Content Security Policy (CSP)?

Проблема безопасности является одной из самых актуальных во всем мире разработки. Разработчики стараются защитить свои веб-сайты от различных угроз, таких как кросс-сайтовые скрипты (XSS). Есть много ошибок, которые могут возникнуть при работе с Content Security Policy (CSP), например, отказ в выполнении встроенного скрипта из-за нарушения директивы CSP.

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

Принцип работы CSP

CSP работает на основе директив, которые задаются в заголовке Content-Security-Policy. Каждая директива контролирует определенные типы контента, которые могут быть загружены на веб-страницу.

Директивы CSP

Различные директивы позволяют разработчикам контролировать различные аспекты загрузки контента:

• default-src устанавливает правила загрузки для всех типов контента по умолчанию.
• script-src определяет источники, из которых разрешено загружать скрипты.
• style-src устанавливает источники для загрузки стилей.
• img-src контролирует источники изображений.
• и т.д.

Можно использовать несколько директив в одной политике безопасности. Например:

Content-Security-Policy: default-src 'self'; img-src https://*; child-src 'none';

Как использовать CSP

Правила CSP задаются в специальном HTTP-заголовке Content-Security-Policy. Например, чтобы разрешить загрузку контента только с того же источника, можно использовать следующий заголовок:

Content-Security-Policy: default-src 'self'

Здесь 'self' означает, что разрешены только те ресурсы, которые загружаются с того же домена, что и сама страница.

Можно использовать несколько источников, просто перечислив их через пробел:

Content-Security-Policy: default-src 'self' https://example.com

Порты и протоколы

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

Content-Security-Policy: img-src https://images.example.com

Использование встроенных стилей и скриптов

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

Content-Security-Policy: script-src 'unsafe-inline'

Функция eval()

Функция eval() также блокируется по умолчанию из-за риска атак. Если вам необходимо использовать eval(), вы можете разрешить его с помощью директивы unsafe-eval:

Content-Security-Policy: script-src 'unsafe-eval'

Но помните, что это может существенно снизить уровень безопасности вашего сайта.