小编gra*_*nty的帖子

如何修复错误“拒绝执行内联脚本,因为它违反了以下内容安全策略指令:

我想在 html 中使用 iframe 但出现此错误:

拒绝执行内联脚本,因为它违反了以下内容安全策略指令:“script-src 'unsafe-eval' 'self'”。启用内联执行需要“unsafe-inline”关键字、哈希值(“sha256-P5polb1UreUSOe5V/Pv7tc+yeZuJXiOi/3fqhGsU7BE=”)或随机数(“nonce-...”)。

我的代码:

<iframe src="test.com" height="200" width="300" title="Iframe Example"></iframe>
Run Code Online (Sandbox Code Playgroud)

我怎样才能解决这个错误提前谢谢

html iframe twitter-bootstrap content-security-policy

5
推荐指数
1
解决办法
3万
查看次数

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

上下文描述 我正在使用 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 策略时都要求唯一的随机数值,但对于此用例,静态随机数将是我的首选建议。

content-security-policy webpack nuxt.js aws-amplify

2
推荐指数
1
解决办法
4076
查看次数