Question

我必须将CSP添加到具有内联样式的页面中，并且为了避免使用unsafe-inline，我使用了哈希。我添加哈希的技术只是将页面加载到Chrome中，查看错误消息并复制所有建议的哈希（例如，从<suggested hash>中提取Refused to apply inline style because it violates the following Content Security Policy directive: "style-src ...". Either the 'unsafe-inline' keyword, a hash ('<suggested hash>'), or... is required to enable inline execution.）。

这可以解决Firefox中的问题，但不能解决Chrome中的问题。奇怪的是，Chrome似乎并不尊重它本身生成的哈希值。这会导致一种奇怪的情况，Chrome浏览器会列出包含哈希的策略，说它不符合要求，然后建议我添加之前在其打印的策略中添加的哈希。

我的政策：

default-src 'none'; font-src 'self' data:; img-src 'self'; script-src 'self' 'report-sample'; style-src 'self' 'sha256-/3kWSXHts8LrwfemLzY9W0tOv5I4eLIhrf0pT8cU0WI=' 'sha256-47DEQpj8HBSa+/TImW+5JCeuQeRkm5NMpJWZG3hSuFU=' 'sha256-OTeu7NEHDo6qutIWo0F2TmYrDhsKWCzrUgGoxxHGJ8o=' 'sha256-fviu5RwuBYFcCd5CDanhy6NCLufcwvCAbm061aSqhoQ=' 'sha256-wS7xf+bhXBr5EM064hQkAW0vX3ks5VoxbGn+KQC/Vhk=' 'sha256-cxL35Ug49Sl1zHMOdz/r0xinQ6BYGgClHdDCk2XPTzE='; object-src 'self'; connect-src 'self'

这会导致许多错误，例如：

Refused to apply inline style because it violates the following Content Security Policy directive: "style-src 'self' 'sha256-/3kWSXHts8LrwfemLzY9W0tOv5I4eLIhrf0pT8cU0WI=' 'sha256-47DEQpj8HBSa+/TImW+5JCeuQeRkm5NMpJWZG3hSuFU=' 'sha256-OTeu7NEHDo6qutIWo0F2TmYrDhsKWCzrUgGoxxHGJ8o=' 'sha256-fviu5RwuBYFcCd5CDanhy6NCLufcwvCAbm061aSqhoQ=' 'sha256-wS7xf+bhXBr5EM064hQkAW0vX3ks5VoxbGn+KQC/Vhk=' 'sha256-cxL35Ug49Sl1zHMOdz/r0xinQ6BYGgClHdDCk2XPTzE='". Either the 'unsafe-inline' keyword, a hash ('sha256-/3kWSXHts8LrwfemLzY9W0tOv5I4eLIhrf0pT8cU0WI='), or a nonce ('nonce-...') is required to enable inline execution.，其中Chrome浏览器建议我添加该策略中已经存在的哈希。

可能我缺少一些特定于Chrome的陷阱。有什么想法吗？

Answer 1

我假设您在样式属性中拥有内联样式（与内联<style>元素相对）。根据{{3}}，散列应该仅应用于内联<style>元素，而不应用于样式属性。

尽管Chrome显示样式属性的错误消息非常混乱，但实际上符合规范（某些其他浏览器，例如Firefox和IE则不然）。您不能在Chrome的CSP中使用哈希码来允许内联样式属性。如果您绝对需要允许它们，则必须使用'unsafe-inline'。

CSP 3.0规范可能包括使用['unsafe-hashed-attributes'][2]将哈希码扩展为样式属性的可能性。不过，此功能目前仍处于“进行中”状态，并且似乎尚未在Chrome中实现。

示例：

<?php
header("Content-Security-Policy: style-src 'self' 'sha256-U/AHSCAVB2ZhU2+kPeMhPfZyIE2wH4fhQ0ZtYjq9/JA=' 'sha256-l8V8xXSfpuv7xbN4e0tIS0v77DG2xfSC1rSpNZak/K8='");
header("Content-Type: text/html");
?>

<!DOCTYPE html>
<html>
  <head>
    <!-- Inline style - 'sha256-U/AHSCAVB2ZhU2+kPeMhPfZyIE2wH4fhQ0ZtYjq9/JA=' -->
    <style>.redtext {color: red;}</style>
  </head>

  <body>
    <div class="redtext">This should be red - style from &lt;style&gt; element.</div>
    <!-- Inline style in attribute - 'sha256-l8V8xXSfpuv7xbN4e0tIS0v77DG2xfSC1rSpNZak/K8=' -->
    <div style = "color: green;">This should not be green - style from attribute should be disallowed even though its hash is included in style-src in CSP.</div>
  </body>
</html>

Chrome为什么不尊重我的内容安全政策哈希？

1 个答案: