为什么CSP安全标头会阻止Iphone上的Google地图？

问题描述

header ("Content-Security-Policy:"
                . "default-src 'none';"
                . "script-src 'self' 'nonce- $ nonce' 'strict-dynamic' * 'unsafe-inline' https://maps.gstatic.com https://maps.googleapis.com;"
                . "style-src 'self' 'unsafe-inline' https://fonts.googleapis.com;"
                . "img-src 'self' data: https://www.google-analytics.com https://im9.cz https://maps.gstatic.com https://maps.googleapis.com https: // www .smartsuppchat.com https://widget-v2.smartsuppcdn.com https://twemoji.maxcdn.com https://files.smartsuppcdn.com maps.gstatic.com * .googleapis.com * .ggpht; "
                . "form-action 'self';"
                . "base-uri 'none';"
                . "manifest-src 'none';"
                . "object-src 'none';"
                . "frame-src https://www.heureka.cz;"
                . "font-src https://fonts.googleapis.com https://fonts.gstatic.com;"
                . "media-src 'self' https://widget-v2.smartsuppcdn.com;"
                . "connect-src 'self' https://bootstrap.smartsuppchat.com https://widget-v2.smartsuppcdn.com wss: //websocket-visitors.smartsupp.com https://www.google-analytics.com https : //files.smartsupp.com https://maps.gstatic.com https://maps.googleapis.com; "
                . "frame-ancestors 'self';");

然后是此javascript，我在其中加载了Google地图：

" src = "https://maps.googleapis.com/maps/api/js?key=AIzaSyDkzPP8cFmN7hV_va8mYdrQOrBlL9VVlwY&callback=initMap" async defer>

我要解决的问题是它不会在Iphone上加载地图。它可以在其他任何地方（Windows，Android）使用。开发人员工具（F12）不再显示任何错误。不幸的是，我没有苹果，iPhone也没有给我显示任何东西（当然没有开发工具）。

有人请问该怎么做？

谢谢

'nonce- $ nonce' 因此我发现iOS不支持随机数，这是一个问题。因为他不能使用它。当我放弃随机数时，它可以工作，但是在支持CSP3的浏览器中不起作用。我不知道该怎么办。根据其他讨论，应忽略此规则，而应使用另一条“不安全内联”规则，但出于某些未知原因，事实并非如此。

有人知道该怎么做吗？

解决方法

有很多旧浏览器不支持 CSP2*。您可以添加 'unsafe-inline' 作为后备。较新的浏览器将使用 'nonce-$nonce' 作为默认值。如果您使用 CSP 评估程序*来检查您的政策，他们也会因此建议您添加此内容。

参考文献：

*https://caniuse.com/contentsecuritypolicy2

*https://csp-evaluator.withgoogle.com/

'nonce- $ nonce' 所以我发现iOS不支持nonce，这是一个问题。因为他不能用它。当我放弃 nonce 时，它可以工作，但在支持 CSP3 的浏览器中不起作用。我不知道该怎么办。根据其他讨论，这应该被忽略，应该使用另一个“不安全内联”规则，但由于某些未知原因，它不是。

Safari 确实支持 'nonce-value'，但支持 does not support 'strict-dymanic'。还有 'strict-dynamic' overrides 'unsafe-inline' 和所有基于主机的源。
因此，当您删除 'nonce-value' 时，保留的 'strict-dynamic' 会取消 'unsafe-inline'、'self' 和 CSP3 兼容浏览器中的所有主机，但不会取消 Safari。
因此，您观察到的效果。删除 'strict-dynamic' 时必须删除 'nonce-value'，这些只能成对使用。
您的 CSP 有 lot of errors，但看起来这些应该不会影响 Google 地图的工作。
因此，请检查您的 Iphone 中的 Google Map test。可以选中 'nonce-value' 和 'strict-dynamic' 复选框并检查它们的支持情况。
如果测试正常，您只需要调整您的 CSP。

content-security-policy google-maps iphone javascript