为啥我不能使用 SRI 从本地计算机 (file:///) 加载文件？

Posted 2023-03-03

【中文标题】为啥我不能使用 SRI 从本地计算机 (file:///) 加载文件？

【英文标题】：Why can't I load files from my local machine (file:///) using SRI?为什么我不能使用 SRI 从本地计算机 (file:///) 加载文件？

【发布时间】：2019-04-04 13:42:16

【问题描述】：

我有一些网页试图从file:/// 加载到我的浏览器中，并且我在 JS 和 CSS 上有完整性哈希。

JS 和 CSS 不会加载存在于 <link> 和 <script> 标记中的完整性哈希，但它们会在加载时删除它。

$ openssl dgst -sha384 -binary assets/css/bootstrap.min.css | openssl base64 -A
MCw98/SFnGE8fJT3GXwEOngsV7Zt27NXFoaoApmYm81iuXoPkFOJwJ8ERdknLPMO

我有以下<script> 标签：

<link rel="stylesheet" href="assets/css/bootstrap.min.css" integrity="sha384-MCw98/SFnGE8fJT3GXwEOngsV7Zt27NXFoaoApmYm81iuXoPkFOJwJ8ERdknLPMO">

【问题讨论】：

控制台有错误吗？

不，控制台中没有任何内容。

在哪些浏览器中？您在所有浏览器中都观察到相同的行为——资产不加载，控制台中没有错误？

@sideshowbarker 好问题。我使用的是 Chrome，但它不起作用，但在 FF 中加载正常。然后我退出并重新启动 Chrome 并开始在控制台中收到 CORS 错误消息，因此我添加了一个 crossorigin="anonymous" 属性并且错误消失了，我看到文件在网络选项卡中加载，但仍然没有应用样式。

对于 Chrome，您可能需要禁用所有扩展程序并重试

【参考方案1】：

通常，为完整性属性提供的哈希值是根据文件内容生成的。因此，请确保您从文件“assets/css/bootstrap.min.css”生成适当的哈希。综合解释可参考https://www.smashingmagazine.com/2019/04/understanding-subresource-integrity/