Question

我正在尝试使用由Cloudflare支持的HTTP / 2服务器推送。我正在尝试使用以下HTTP标头推送两个资产...

Link: </img/whysoslow-hero.jpg>; rel=preload; as=image, </lib/bootstrap.min.css>; rel=preload; as=style

该图像在样式表中作为背景图像被引用，并且已被推送然后正确使用（下载一次）。

但是，我是在这样的页面HTML中引用样式表的...

<link rel="stylesheet" href="/lib/bootstrap.min.css">

...它既被推送，又被获取（下载两次）。

下面是Chrome中“网络”标签的屏幕截图，显示了资产已推送，但随后再次下载了样式表...

任何人都可以向我解释为什么会发生这种情况以及如何解决吗？

编辑：

此后，我注意到控制台在说...

找到了“ https://whysoslow.co.uk/lib/bootstrap.min.css”的预加载，但由于完整性不匹配而未使用。

因此是SRI检查失败。但是我不明白为什么，它要获取相同的文件，因此应该相同。为什么它们不一样？

Answer 1

现在我已经弄清楚了，我也设法找到了答案...

简短的回答：您无法预加载和使用SRI，尚不支持。