photoplaces/obsidian_data/Photoplaces_data/atomic-csp-configuration.md

Content Security Policy для SPA с картами

Контекст: Фронтенд использует Яндекс.Карты (загрузка скриптов и стилей с api-maps.yandex.ru). Без CSP сайт уязвим к XSS-атакам.

Суть: CSP настраивается в Caddyfile (reverse proxy) и блокирует неразрешённые источники.

Content-Security-Policy: default-src 'self';
    script-src 'self' 'unsafe-inline' 'unsafe-eval' https://api-maps.yandex.ru;
    style-src 'self' 'unsafe-inline';
    img-src 'self' data: blob: https:;
    font-src 'self' data:;
    connect-src 'self' wss: https://api.{$DOMAIN} https://api-maps.yandex.ru;
    frame-ancestors 'none';

Почему именно так:

• 'unsafe-inline' для script — требуется Next.js (hydration)
• 'unsafe-eval' для script — требуется Яндекс.Картам
• frame-ancestors 'none' — защита от clickjacking (дублирует X-Frame-Options)
• connect-src wss: — для WebSocket посетителей

Что НЕ должно быть в production CSP:

• 'unsafe-inline' для script лучше убрать, если Next.js в standalone режиме это позволяет
• https: для img-src — можно сузить до конкретных доменов (cdn.photoplaces.ru, api-maps.yandex.ru)

Связанные заметки: [[deploy-production-readiness]], [[atomic-websocket-origin-check]] Источник: Настройка Caddyfile для production

#security #frontend #devops #caddy