Как разрешить iframe с политикой безопасности контента (CSP)

Question

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

Сегодня, хотя я хотел интегрировать третью часть системы бронирования календаря (Calendly). Они используют iframe для всплывающих окон, и я не могу принять его в политике безопасности.

Я получаю эту ошибку "отказался создавать фрейм" url-to-calendly ", поскольку он нарушает следующую директиву политики безопасности содержимого:" frame-src "...

Я устал добавлять это в компонент frame-src frame-src https://assets.calendly.com; frame-src 'self' https://assets.calendly.com; frame-src 'self' https://assets.calendly.com 'unsafe-inline'; frame-src https://assets.calendly.com 'nonce-lots-of-digits'; frame-src 'self' https://assets.calendly.com 'nonce-lots-of-digits';

Я сделал то же самое в соответствии с директивой child-src. Поскольку frame-src больше не используется во второй версии. Опять же, это не сработало. Вот мой полный CSP. Любая помощь здесь будет принята с благодарностью - спасибо. Ps. Я использовал Chrome Dev Tools. В Safari он тоже не работает.

Content-Security-Policy: 
script-src 'nonce-4dfb7738f82d40efc1b73a80491d6dd0bb839173' 'unsafe-inline'; object-src 'none'; 
default-src 'nonce-77184b203c574dfd8ecc7fac417bf078242d4657'; 
img-src 'self' https://www.google-analytics.com www.google-analytics.com https://stats.g.doubleclick.net; 
style-src 'self' https://assets.calendly.com; 
font-src 'self'; 
connect-src 'self' https://www.google-analytics.com www.google-analytics.com https://stats.g.doubleclick.net; 
base-uri 'none'; 
child-src https://assets.calendly.com; 
frame-src https://assets.calendly.com;

Answer 1

Чтобы Calendly работал на вашем сайте, вам нужно добавить следующие правила CSP:

frame-src https://calendly.com;
script-src https://assets.calendly.com;
style-src 'unsafe-inline';

Answer 2

Так что на самом деле ответ оказался очень простым. Я связался с календарем напрямую, и простым решением было изменить добавленный URL. https://calendly.com было достаточно, чтобы сделать трюк.

Так что URL, который вы дали @andrii, был правильным - спасибо. Однако использование «unsafe-inline» не рекомендуется. Использование этого в любом из источников делает ваш CSP практически бессмысленным.