如何为脚本和样式标签添加随机数以避免“不安全内联”CSP 标头字段？

Question

上下文描述 我正在使用 AWS Amplify 部署我的静态网页。

自定义安全标头通过配置文件 customHttp.yml ( https://docs.aws.amazon.com/amplify/latest/userguide/custom-headers.htm )应用到部署中

我将 customHttp.yml 文件包含在 .nuxtignore 文件中，以防止在仅自定义标头发生更改时触发 webpack 文件的重建。但是，这仅适用于本地，而不适用于部署过程中的服务器端。

问题描述 AWS Amplify 在部署过程中不使用 .nuxtignore 文件。因此，每次都会重新构建 webpack 文件，从而产生不同的哈希值，我需要将其包含在 CSP 标头字段 script-src 和 style-src 中。但由于触发重建以对 customHttp.yml 进行修改会导致 jetpack 文件产生新的值，因此我们永远不会预先知道正确的值。

解决问题的建议 随机数将（如果是静态的）解决我的用例。例如，通过在 nuxt.config.js 文件中定义随机数。通过在 webpack 重建中包含随机数，我将能够引用 CSP 标头字段中的静态随机数，因为该值不会更改。

例如 - nuxt.config.js：

生成：{ script-nonce：'nonce-457bb2Bb06E44Ab5aa9996Ed1a34b26F'，style-nonce：'nonce-[在此处添加值]'}

我意识到内容安全策略规范在每次服务器传输 CSP 策略时都要求唯一的随机数值，但对于此用例，静态随机数将是我的首选建议。

Answer 1

使用“静态随机数”与用法相同'unsafe-inline'。您只能愚弄一些在线 CSP 测试工具，让他们无法识别您的'nonce-value'静态数据。

经典 XSS 是指可以插入和执行类似<script>alert('XSS')</script>. 如果没有'unsafe-inline'这样的内联脚本将会被阻止。

但是，使用“静态随机数”攻击者只需注入，因此您将拥有与允许<script nonce="static_nonce">alert('XSS')</script>时完全相同的漏洞。'unsafe-inline'

虽然使用动态随机数，攻击者可以看到当前的随机数，但无法预测下一个随机数。所以他不知道要使用哪个随机数值，因为他的 XSS 只有在页面重新加载后才会被注入。

请参阅启用 CSP 的 vis amplify.yml 导致错误 #612，也许您会在那里找到一些线索（链接到底部的 Lambda@Edge 函数和 Amazon CloudFront）。