CSP 的 style-src 为啥会阻止内联样式?

宇文美美 阅读 70

我在项目里加了 Content Security Policy,结果页面的内联样式全挂了,控制台报错说被 style-src 阻止了。

我试过在 CSP 里加上 'unsafe-inline',但听说这不安全。有没有更安全的办法?比如用 nonce 或 hash?

我的 CSP 头现在是这样:

Content-Security-Policy: default-src 'self'; style-src 'self'
我来解答 赞 13 收藏
二维码
手机扫码查看
1 条解答
一云碧
一云碧 Lv1
CSP 的 style-src 确实会阻止内联样式,这是为了防止 XSS 攻击。你说得对,加 'unsafe-inline' 不安全,那我们可以用 nonce 或 hash 来替代。

用 nonce 的方法是这样的:

1. 后端生成一个随机字符串,作为 nonce 值。
2. 在 CSP 头里指定这个 nonce 值,比如 style-src 'self' 'nonce-randomString123'
3. 在 HTML 文件里的 style 标签或者 style 属性里,也指定相同的 nonce 值,比如