javascript - Content-Security-Policy HTTP header 无法正常用于脚本源

Question

我正在关注 Google's strict CSP policy对于我的 CSP header ，我正确地添加了 nonce，但是我的脚本在浏览器中不断收到此错误:

Refused to load the script 'http://localhost:8080/client/dist/inline.6e0c61259742e86be1dd.bundle.js' because it violates the following Content Security Policy directive: "script-src nonce-XVlBzgbaiCMRAjWwhTHctcuAxhxKQFDaFpLSjFbcXoEFfRsWxP 'unsafe-inline' 'unsafe-eval' 'strict-dynamic' https: http:". 'strict-dynamic' is present, so host-based whitelisting is disabled.

如您所见，随机数与脚本中的随机数匹配:

<script type="text/javascript" src="/client/dist/inline.6e0c61259742e86be1dd.bundle.js" nonce="XVlBzgbaiCMRAjWwhTHctcuAxhxKQFDaFpLSjFbcXoEFfRsWxP"></script>

这是我为 script-src 使用的 CSP header 。 "%s"表示随机生成的随机数，它将在响应中设置 header 之前进行插值:

script-src nonce-%s 'unsafe-inline' 'unsafe-eval' 'strict-dynamic' https: http:;

我在这里做错了什么？

Answer 1

看起来您没有用单引号将 nonce 值括起来——而不是 nonce-%s 它应该是 'nonce-%s' 在您的政策。

由于您使用的是 Google 示例，因此您可能知道使策略安全所需的其他指令(例如 object-src 和 base-uri)，但是为了以防万一，请确保使用 CSP Evaluator 之类的工具完成后检查您的保单。