Перейти к основному содержимому

Content Security Policy

Код ShopStory Web SDK выполняется в контексте origin сайта ритейлера. Разрешайте в CSP только те ресурсы ShopStory, которые использует согласованная интеграция.

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

Базовые источники​

DirectiveИсточникКогда нужен
script-srchttps://app.shopstory.liveЗагрузка Web SDK
connect-srchttps://app.shopstory.livePublic API и запросы Web SDK во время работы
connect-srcwss://app.shopstory.liveLive-соединение, если оно используется сценарием
frame-srchttps://app.shopstory.liveФрейм ShopStory, если он включён
img-srchttps://app.shopstory.liveИзображения ShopStory; отдельно добавьте точные origins изображений товарного фида
media-srcвыдаются для проектаСписок origins для видео зависит от маршрута доставки
worker-srcblob:Только если проверка в браузере подтверждает работу Web Worker через blob URL

Домены изображений товара и видео могут отличаться по проектам. ShopStory указывает итоговый список origins в интеграционном пакете. Не добавляйте https: или * вместо этого списка.

Устаревший watch.shopstory.live не является базовым origin текущего Web SDK.

Пример политики​

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

merchant-site.conf
add_header Content-Security-Policy "
  default-src 'self';
  script-src 'self' https://app.shopstory.live;
  connect-src 'self' https://app.shopstory.live wss://app.shopstory.live;
  frame-src 'self' https://app.shopstory.live;
  img-src 'self' data: https://app.shopstory.live;
  media-src 'self' blob: https://<assigned-media-origin>;
  font-src 'self';
  style-src 'self' 'unsafe-inline';
  object-src 'none';
  base-uri 'self';
  form-action 'self';
  frame-ancestors 'self';
" always;

<assigned-media-origin> — служебная заглушка. Перед выпуском в production замените её значением из интеграционного пакета.

Inline-стили​

Web SDK добавляет CSS в документ сайта. Разрешите 'unsafe-inline' только в style-src. Если правила сайта запрещают это значение, остановите подключение и согласуйте с ShopStory другой способ поставки стилей. Для текущего публичного bundle ShopStory не заявляет контракт с nonce или hash.

Не добавляйте из-за ShopStory:

  • 'unsafe-eval' в script-src;
  • 'unsafe-inline' в script-src;
  • wildcard *;
  • data: или blob: в script-src;
  • произвольный https: в connect-src, frame-src или media-src.

Проверка через Report-Only​

Сначала включите политику без блокировки:

merchant-site-report-only.conf
add_header Content-Security-Policy-Report-Only "
  default-src 'self';
  script-src 'self' https://app.shopstory.live;
  connect-src 'self' https://app.shopstory.live wss://app.shopstory.live;
  frame-src 'self' https://app.shopstory.live;
  img-src 'self' data: https://app.shopstory.live;
  media-src 'self' blob: https://<assigned-media-origin>;
  font-src 'self';
  style-src 'self' 'unsafe-inline';
  object-src 'none';
  base-uri 'self';
" always;

Проверьте реальные сценарии:

  1. Каталог и открытие live.
  2. Воспроизведение VOD и seek.
  3. Mini-player на карточке товара.
  4. Live-widget.
  5. Открытие товара и добавление в корзину.
  6. Mobile WebView, если он входит в проект.

В отчётах проверьте effective-directive, blocked-uri и route страницы. Перед сохранением CSP reports удаляйте query string и пользовательские данные.

После проверки перенесите политику в Content-Security-Policy. Не оставляйте Report-Only единственной политикой.

Security headers сайта​

Следующий блок — общий baseline для сайта, а не обязательная конфигурация ShopStory. Сохраните действующие headers и проверьте, какие возможности использует сам сайт.

Добавьте следующие headers:

add_header Strict-Transport-Security "max-age=31536000; includeSubDomains" always;
add_header X-Content-Type-Options "nosniff" always;
add_header Referrer-Policy "strict-origin-when-cross-origin" always;
add_header X-XSS-Protection "0" always;

Включайте HSTS includeSubDomains и preload только при гарантированном HTTPS во всём соответствующем namespace. X-XSS-Protection: 0 отключает устаревший browser filter. От XSS защищают корректное escaping и CSP.

Permissions-Policy остаётся в зоне ответственности ритейлера. Не отключайте geolocation, если она нужна выбору магазина, доставке или другой функции сайта. Ограничения camera, microphone и остальных возможностей согласуйте с действующей политикой продукта.

Если в Nginx внутри location задан собственный add_header, родительские headers могут перестать наследоваться. Проверьте каждый тип ответа: HTML, JS, YAML/JSON, ошибки и Swagger.

Проверка​

check-csp.sh
curl -sSI https://shop.example/live/ \
  | grep -Ei 'content-security-policy|strict-transport|content-type-options|referrer-policy'

В DevTools проверьте Console и Network, затем повторите тест с отключённым cache. Полученный header подтверждает только доставку политики. На production-сайте воспроизведите видео и выполните commerce actions.

Распределение ответственности: Безопасность.

Последнее обновление