Django stripe js блокировка встроенного скрипта

Question

Я пытаюсь внедрить систему чековых платежей в Джанго.Для добавления карточных платежей я следовал руководству в этой ссылке. После добавления разметки HTML в шаблоне Django и кода CSS и JS в виде отдельных статических файлов я получил следующую ошибку консоли в Firefox:

Content Security Policy: The page’s settings blocked the loading of a resource at inline (“script-src”)

Я понимаю из сообщения об ошибке выше, что <script src="https://js.stripe.com/v3/"></script> JS-файл содержит ссылки на другие JS-файлы, и Firefox блокирует такие соединения.Следует отметить, что на этом этапе платеж по тестовой кредитной карте работает, как ожидалось, и сумма, списанная клиентом, добавляется к тестовому балансу моего стрип-аккаунта.Чтобы решить эту проблему блокировки, я следовал инструкциям в этой ссылке. Поэтому я добавил следующий тег meta в свой шаблон Django:

<meta http-equiv="Content-Security-Policy" content="connect-src https://api.stripe.com; frame-src https://js.stripe.com https://hooks.stripe.com; script-src https://js.stripe.com" />

После добавления выше Content-Security-PolicyДирективы, консоль Firefox больше не показывает вышеупомянутые ошибки блокировки, но на этот раз мои статические файлы JS заблокированы.Я изменил директивы, как показано ниже, для разрешения моих файлов JS (добавлено 'self 'к директиве 'script-src'):

<meta http-equiv="Content-Security-Policy" content="connect-src https://api.stripe.com; frame-src https://js.stripe.com https://hooks.stripe.com; script-src 'self' https://js.stripe.com" />

И на этот раз перед упомянутой ошибкой блокировки встроенного сценария снова появилась в консоли Firefox.:)

Можете ли вы помочь мне в этом вопросе?Верно ли мое понимание причины ошибки консоли Firefox?Почему внедренное решение не работает?

РЕДАКТИРОВАТЬ

Может ли это быть просто ошибкой Firefox, учитывая, что платеж работает, как ожидалось, и браузер Chromium не регистрирует ошибку разработчикаинструменты?

Answer 1

Согласно Документам Mozilla по Content-Security-Policy, существует тонн других политик безопасности, и если для ваших файлов js / css требуется установить одну из них, онибудет заблокирован.

К счастью, есть простое исправление, default-src.Из вышеупомянутых документов:

Директива default-src HTTP Content-Security-Policy (CSP) служит резервной для других директив CSP fetch .Для каждой из следующих отсутствующих директив пользовательский агент будет искать директиву default-src и будет использовать для нее это значение:

<meta http-equiv="Content-Security-Policy" content="default-src 'self'; ...

Примечание , что default-src применяется только к извлечению директив (что бы это ни значило).Поэтому вам может потребоваться добавить несколько политик (например, inline-src, которые все используют), которые требуются для вашей страницы.

Кроме того, вам нужно будет указать self для каждой политики, которую вы определяете, потому что Firefox будетОбращайтесь к default-src только в том случае, если требуемая политика равна null .

Так что если у вас есть такая политика:

<meta http-equiv="Content-Security-Policy" content="default-src 'self'; script-src http://example.com;">

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

К сожалению, это также распространяется на все зависимости, которые есть у вашего скрипта, такие как bootstrap или jQuery .каждая зависимость должна быть явно указана в каждой требуемой политике.

Если бы только у кого-то был пакет , чтобы упростить этот процесс ...

Наконец, этот ответ был отличным ресурсом для изучения Content-Security-Policy.