HTTP / 2服务器推送导致重复请求

Question

对具有以下标题的文档的响应输入Nginx：

link: </picture.jpg>; as=image; rel=preload
link: </_next/static/chunks/commons.4e96503c89eea0476d3e.module.js>; as=script; rel=preload
link: </_next/static/runtime/main-3c17cb16bbbc3efc4bb5.module.js>; as=script; rel=preload
link: </_next/static/runtime/webpack-0b10894b69bf5a718e01.module.js>; as=script; rel=preload
link: </_next/static/Q53NXtgLT1rgpqOOsVV6Q/pages/_app.module.js>; as=script; rel=preload
link: </_next/static/Q53NXtgLT1rgpqOOsVV6Q/pages/index.module.js>; as=script; rel=preload

借助HTTP / 2服务器推送，请求被推送到客户端，但是6个请求中有5个下载了两次（一次通过推送，一次由文档触发）。Chrome开发工具中的“网络”标签如下所示：我测试了Type的设置是否正确，似乎还可以。可能是什么问题？

连续请求（启用Chrome缓存）也以类似的方式产生：

可能出什么事了？我很确定请求不应重复

Answer 1

您的HTML是通过普通的“凭据”连接请求的。然后，它在该连接上推送JPG和JS。

然后，您的页面还会通过anonymous跨域设置加载。因此它无法使用推送资源并再次请求它们。

请参见此处以获取更多详细信息：https://jakearchibald.com/2017/h2-push-tougher-than-i-thought/#requests-without-credentials-use-a-separate-connection

Btw recommendations are only to push a small amount，而不是页面所需的每个资源。如果您甚至想使用推力，那是因为它很复杂，而收益并没有得到真正证明是值得整体考虑的。