我正在尝试在依赖于光滑网格 (slickgrid.js) 的项目上添加 CSP 标头。我认为以下行会导致问题：
$focusSink = $("<div tabIndex='0' hideFocus style='position:fixed;width:0;height:0;top:0;left:0;outline:0;'></div>").appendTo($container)
这是我在浏览器上遇到的错误：
Refused to apply inline style because it violates the following Content Security Policy directive: "style-src 'self'
我尝试了 sha256- 但它没有帮助，因为这些是样式属性。还有其他选择吗？
答案 0 :(得分：0)
要允许 style= 属性，它需要使用 'sha256-...' 和 'unsafe-hashes' 标记。 Chrome 和 Firefox 支持它，但not in Safari。
因此，就目前而言，除了在 style-src 指令中使用“unsafe-inline”外，您别无选择。此外，如果使用许多不同的样式 = '...'，收集它们的所有哈希值并保持最新是不现实的。
您能做的最好的事情就是这样的 CSP：
style-src 'self' 'unsafe-inline'; style-src-attr 'unsafe-inline'; style-src-elem 'self';
由于 <style>..</style> 将适用于 Chrome，因此至少 Chrome 用户将受到保护，免受 style-src-elem 'self' 的 XSS 注入。 Safari 和 Firefox 将使用 style-src 'self' 'unsafe-inline' 规则。
或者，您可以重写 JS 代码以使用 class='' 而不是 style=''，或者使用不需要 Element.style.properrty = 'display:none'; 令牌的 JS 构造，例如 'unsafe-inline'。