Как настроить CSP nonce

1. Сгенерируйте nonce per-request: $nonce = base64_encode(random_bytes(16));
2. Установите CSP header: Content-Security-Policy: script-src 'self' 'nonce-<NONCE>' 'strict-dynamic'
3. В HTML: <script nonce="<NONCE>">doStuff()</script>
4. Всё остальное inline — заблокировано (как и должно быть против XSS)
5. Для React/Next.js: через __webpack_nonce__ + middleware
6. Проверьте: DevTools → Console → не должно быть "Refused to execute inline script"
7. Enterno CSP Analyzer → grade = A

• Nonce не случайный (timestamp, sequential) — attacker может предугадать
• Nonce используется > 1 request — полностью ломает безопасность
• Забыть добавить nonce к legitimate inline script — блокирован, sign-in форма не работает
• Google Analytics / GTM scripts не ожидают nonce — используйте strict-dynamic или hash
• CSP header в HTML meta вместо HTTP header — не эффективен против XSS первой страницы

Чтобы настроить Content Security Policy (CSP) с использованием nonce и убрать директиву unsafe-inline, вам нужно добавить в HTTP-заголовок Content-Security-Policy параметр script-src с указанием nonce-{значение}. При этом каждое встроенное скриптовое содержимое должно иметь атрибут nonce с тем же значением. Это позволяет браузеру разрешать выполнение только тех скриптов, которые имеют правильный nonce, обеспечивая высокий уровень безопасности.

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

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

Для настройки CSP с использованием nonce вам нужно внести изменения в конфигурацию сервера и HTML-код. Рассмотрим пример настройки на сервере Nginx.

server {
    listen 80;
    server_name example.com;

    add_header Content-Security-Policy "script-src 'self' 'nonce-{nonce_value}';";

    location / {
        root /var/www/html;
        index index.html;
    }
}

Здесь {nonce_value} — это случайное значение, которое вы должны генерировать для каждого запроса. Например, вы можете использовать PHP для генерации nonce:

<?php
$nonce = base64_encode(random_bytes(16));
header("Content-Security-Policy: script-src 'self' 'nonce-{$nonce}';");
?>

В вашем HTML-коде вы должны добавить атрибут nonce к каждому встроенному скрипту:

<script nonce="{$nonce}">
    console.log('Hello, world!');
</script>

Не забудьте обновить значение nonce для каждого запроса, чтобы обеспечить максимальную безопасность. Таким образом, вы сможете избежать использования unsafe-inline и защитить ваше приложение от XSS-атак.