HTTP/2 服务器推送不适用于 JavaScript 个文件
HTTP/2 Server Push not working for JavaScript files
我正在尝试使用以下代码通过 CloudFlare Worker 实施 HTTP/2 服务器推送：
let mainScript='main-es2015.e66dc0bc532401d980dc.js';
response.headers.append("Link", "</"+mainScript+">; rel=preload; as=script;");
我也尝试过添加 crossorigin
response.headers.append("Link", "</"+mainScript+">; rel=preload; as=script; crossorigin;");
但它不起作用。
在第一种情况下，开发人员控制台确实显示正在从 CloudFlare 服务器推送文件以及 html 响应。
但浏览器不使用该文件并重复请求再次下载该文件。
在第二种情况下，开发者控制台显示浏览器确实支持预加载 header，但是
文件不是从 Cloudflare 服务器推送的，浏览器必须单独请求提取 javascript 文件，
虽然它在收到 html 文件后立即发出请求。
我想要的是 cloudflare 服务器推送文件和浏览器使用推送的文件而不发出重复请求？
令人惊讶的是，下面的代码非常适合 css 个文件：
response.headers.append("Link", "</styles.1d228f78d240e617dd5e.css>; rel=preload; as=style;");
但不适用于 javascript 字体文件、图像等任何其他内容
任何人都可以指导我在这里缺少什么吗？
正如离线讨论的那样，您有两个问题：
您的字体被双重下载，而不是使用推送版本
字体需要 link header 中的 crossorigin 属性，否则推送将被忽略。看到这个答案：HTTP2 pushed webfonts not used
但是，即使您添加了 Cloudflare 似乎停止推送，所以他们可能不支持。
您的大多数 JavaScript 文件同样被双重下载，而不是使用推送版本
这是因为您将它们指定为模块：
<script src="main-es2015.e66dc0bc532401d980dc.js" type="module"></script>
而不是简单的脚本文件：
<script src="main-es2015.e66dc0bc532401d980dc.js"></script>
推送成功的，没有定义为模块。将 link header 更改为 as="module" 似乎在 Chrome 中有效，但 this is not in the preload specification, and looks like an alternative is under discussion 因此不确定它的支持程度或是否会继续支持。
我正在尝试使用以下代码通过 CloudFlare Worker 实施 HTTP/2 服务器推送：
let mainScript='main-es2015.e66dc0bc532401d980dc.js';
response.headers.append("Link", "</"+mainScript+">; rel=preload; as=script;");
我也尝试过添加 crossorigin
response.headers.append("Link", "</"+mainScript+">; rel=preload; as=script; crossorigin;");
但它不起作用。
在第一种情况下，开发人员控制台确实显示正在从 CloudFlare 服务器推送文件以及 html 响应。 但浏览器不使用该文件并重复请求再次下载该文件。
在第二种情况下，开发者控制台显示浏览器确实支持预加载 header，但是 文件不是从 Cloudflare 服务器推送的，浏览器必须单独请求提取 javascript 文件， 虽然它在收到 html 文件后立即发出请求。
我想要的是 cloudflare 服务器推送文件和浏览器使用推送的文件而不发出重复请求？
令人惊讶的是，下面的代码非常适合 css 个文件：
response.headers.append("Link", "</styles.1d228f78d240e617dd5e.css>; rel=preload; as=style;");
但不适用于 javascript 字体文件、图像等任何其他内容
任何人都可以指导我在这里缺少什么吗？
正如离线讨论的那样，您有两个问题：
您的字体被双重下载，而不是使用推送版本
字体需要 link header 中的 crossorigin 属性，否则推送将被忽略。看到这个答案：HTTP2 pushed webfonts not used
但是，即使您添加了 Cloudflare 似乎停止推送，所以他们可能不支持。
您的大多数 JavaScript 文件同样被双重下载，而不是使用推送版本
这是因为您将它们指定为模块：
<script src="main-es2015.e66dc0bc532401d980dc.js" type="module"></script>
而不是简单的脚本文件：
<script src="main-es2015.e66dc0bc532401d980dc.js"></script>
推送成功的，没有定义为模块。将 link header 更改为 as="module" 似乎在 Chrome 中有效，但 this is not in the preload specification, and looks like an alternative is under discussion 因此不确定它的支持程度或是否会继续支持。