Я несколько раз получаю ошибку ниже в консоли инструмента разработчика chrome для файла common.js maps.googleapis.com-
common.js:15
Refused to apply inline style because it violates the following Content Security Policy directive: "style-src 'self' https://fonts.googleapis.com https://s3.amazonaws.com https://maxcdn.bootstrapcdn.com". Either the 'unsafe-inline' keyword, a hash ('sha256-mmA4m52ZWPKWAzDvKQbF7Qhx9VHCZ2pcEdC0f9Xn/Po='), or a nonce ('nonce-...') is required to enable inline execution.
Мне нужно использовать строгую политику CSP, поэтому я не могу использовать unsafe-inline или unsafe-eval, чтобы ослабить политику. Для поддержки строгой политики CSP встроенные стили и сценарии не допускаются. И кажется, что встроенные стили использовались в common.js API карты Google, из-за чего я получаю указанную выше ошибку.
Любое предложение?
Любое предложение?
Используйте токен 'nonce-value'
в script-src
и такой же в style-src
. Если вы вызываете API GMaps с атрибутом nonce='value'
:
<script async defer src='//maps.googleapis.com/maps/api/js?key=<api_key_here>&callback=initMap' nonce='base64value'></script>
Скрипт API карт Google перераспределяет этот nonce='base64value'
во все дочерние внешние скрипты и блоки встроенных стилей. Вы можете проверить это в демоверсии 'nonce' с картой Google, просто установите флажок 'nonce'.
Изменить 24-07-2021:
Я могу подтвердить, что:
nonce
из тега скрипта в стили.Поэтому, к сожалению, ответ таков: используйте «unsafe-inline» и подождите, пока Google реализует «nonce» для стилей.
Нет, ответ Макса Визера ниже пока не работает. Взгляните, например, на Просмотр улиц.
Он может не работать для просмотра улиц, однако он работает для базовой карты. По крайней мере на данный момент!
Кажется, ты прав. Но мне кажется странным, что это изменение в конце апреля привело к нарушениям CSP (поскольку это должно быть изменение только в том, откуда он извлекает одноразовый номер). Для нашего приложения это по крайней мере лучше, чем копирование всего CSS, поскольку нам нужно запустить действительно ограничительный CSP.
Я добавил результаты вашего теста в качестве комментария к системе отслеживания проблем от команды GMaps. На данный момент (июль 2021 г.) они, похоже, еще не работают над официальной поддержкой CSP. Но, по крайней мере, теперь у них есть больше информации о том, что нужно исправить, когда они начнут над этим работать. Если кто-то обнаружит больше нарушений CSP, вероятно, будет разумно оставить комментарий в системе отслеживания проблем. issuetracker.google.com/issues/132600807
Мне тоже это показалось странным, технически не имеет значения, откуда брать значение nonce. Но я не проводил полное тестирование поддержки одноразового номера для CSS, я просто случайно заметил, что скрипт GMaps использует свой одноразовый номер для стилей. Спасибо за комментарии к проблеме трекера, есть надежда, что гугл исправит.
В настоящее время карты Google требуют, чтобы у вас был unsafe-inline
в вашем CSP для style-src
. Для script-src
это все еще работает.~~
Скорректирован тест упомянутого гранта CSPlite.com; На момент написания этого ответа тест говорит
В конце апреля 2021 года скрипт Google maps перестал передавать
'nonce-value'
из родительского скрипта в блоки дочерних стилей<style>...</style>
Временное решение, которое я нашел, заключается в том, чтобы добавить все стили из Google Maps в наш сторонний код CSS. Таким образом, вы по-прежнему будете получать ошибку в консоли, но визуальные ошибки, возникающие из-за style-src
блокировки встроенных стилей из карт Google, исчезнут. Метод, который мы использовали для этого, состоит в том, чтобы просто скопировать все встроенные стили, добавленные картами Google.
Если вы найдете этот ответ, а также хотите, чтобы Карты Google снова поддерживали распределение значений одноразового номера в свои блоки встроенного стиля, оставьте комментарий здесь.
Изменить 22-06-2021:
GMap пока официально не поддерживает одноразовые номера. Недавно произошло изменение, которое улучшило способность Maps JS обрабатывать отдельные одноразовые номера для сценариев и стилей. Теперь, если сайт не имеет одноразового номера в <style>
или <link rel = "stylesheet">
, это приводит к тому, что одноразовый номер не применяется к таблицам стилей Maps JS.
В качестве обходного пути ваш сайт может включать пустой <style>
с предоставленным одноразовым номером, и GMaps JS подберет его.
Для меня решение было здесь: https://csplite.com/csp/test42/#styles_nonce_workaround
Добавление <style nonce='base64value'></style>
сделало свою работу.
На момент написания этого одного недостаточно. Вы по-прежнему получаете ошибки. Ответ Max Visors ниже работает.