无法使用 Google 地图 API 实施严格的内容安全策略

Question

对于maps.googleapis.com的common.js文件，我在chrome开发者工具的控制台中多次收到以下错误

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 策略，不允许内联样式和脚本编写。似乎内联样式已在 google 地图 api 的 common.js 中使用，因此我收到上述错误。

有什么建议吗？

Answer 1

有什么建议吗？

'nonce-value'在和 中使用script-src相同的令牌style-src。如果您使用属性调用 GMaps API nonce='value'：

<script async defer src='//maps.googleapis.com/maps/api/js?key=<api_key_here>&callback=initMap' nonce='base64value'></script>

Google 地图 API 脚本将其重新分配nonce='base64value'到所有子外部脚本和内联样式块中。你可以在谷歌地图的“nonce”演示中检查它，只需选择“nonce”复选框即可。

编辑 2021 年 7 月 24 日：

我可以确认：

• GMap 进行了一些更改，并且不会nonce从脚本标记重新分配到样式中。
• Max Visser 的解决方法现在不再有效。

因此，不幸的是，答案是：使用“unsafe-inline”并等待 Google 为样式实现“nonce”。