为啥 Chrome 对某些资源使用 Http/1.1 而不是 H2

Posted 2023-03-10

【中文标题】为啥 Chrome 对某些资源使用 Http/1.1 而不是 H2

【英文标题】：Why does Chrome use Http/1.1 instead of H2 for some resources为什么 Chrome 对某些资源使用 Http/1.1 而不是 H2

【发布时间】：2017-09-30 18:59:10

【问题描述】：

我们正在为我们的网站启用 H2。在测试期间，我观察到一些资源似乎是使用 Http /1.1 请求的，而其他大多数资源似乎是使用 H2 请求的。有趣的是，相同的资源，当通过一个路径请求时似乎使用 http/1.1，而在另一点似乎使用 H2。

我正在使用在 OSX Sierra 上运行的 Chrome 版本 58.0.3029.96（64 位），以隐身模式运行 这两个资源都是从同一个来源请求的。

请参阅下方来自 Chrome 开发人员工具的屏幕截图以获取资源。

此外，很少有其他资源也使用 http/1.1 请求。关于为什么会发生这种情况的任何想法？此外，当从 http/2 切换到 http/1.1 时，似乎重复使用了相同的连接，这是否也会导致线路阻塞问题？

这里的任何帮助将不胜感激！

【问题讨论】：

您找到解决方案了吗？我有类似的问题

有什么更新吗？这里也一样。有时在 Firefox 中也是如此。在 chrome 中，所有静态文件都是 h2，但 REST 调用是 HTTP/1.1。但仅当远程访问服务器时。当是localhost时，所有请求都是h2。

【参考方案1】：

根据您在屏幕截图中提供的有限信息，我无法解释为什么有时使用 HTTP/1.1 而不是其他时间，因为这不应该发生。

您是否 100% 确定它们的来源相同？资源是否可能是从缓存中提供的，并且是否缓存在 HTTP/1.1 下？

另一方面，您为什么在同一页面加载中两次请求同一来源，因为这似乎是错误的？对于更改的数据（例如 JSON 请求）来说足够公平，但不明白为什么要多次加载 jquery-UI 甚至加载相同的 css 文件？似乎是一个非常奇怪的用例，至少您应该缓存它以再次使用它。

对于您的第二个问题，在 HTTP/2 下，相同的连接被重复用于相同的来源（如果您在具有相同 https 证书的相同 IP 地址上有一个单独的虚拟主机，则在某些用例中这包括相同的效果来源）。这不会导致前端阻塞，因为 HTTP/2 协议专为这种情况而设计，并使用多路复用来混合请求。

但是，这确实会改变请求在开发工具中的显示方式，具体取决于客户端、服务器和带宽。例如，假设您请求两个资源，每个资源都需要 5 秒的时间来下载。在 HTTP/1.1 下，您会看到：

示例

Request 1: start 0 seconds, end 5 seconds.
Request 2: start 5 seconds, end 10 seconds.
Total time to download could be calculated as: 5s + 5s = 10s
Overall Page load time would be 10 seconds

在 HTTP/2 下，您可能会看到这一点（假设第一个请求优先被优先发送完整）：

示例 2a

Request 1: start 0 seconds, end 5 seconds.
Request 2: start 0 seconds, end 10 seconds.
Total time **looks** be 5s + 10s = 15s
Overall Page load time would still be 10 seconds

或者，如果您有足够的带宽同时处理飞行中的两个请求并且如果服务器响应第二个请求比第一个请求晚一秒，它可能看起来像这样：

示例 2b

Request 1: start 0 seconds, end 5 seconds.
Request 2: start 0 seconds, end 6 seconds.
Total time **looks** be 5s + 6s = 11s
Overall Page load time would be 6 seconds

如果您尝试对各部分求和，即使示例 2a 下的总时间相同，但实际上在示例 2b 下快 4 秒，这一点在 HTTP/2 下都“看起来”较慢。您无法在 HTTP/1.1 和 HTTP/2 之间的开发者工具中比较基于同类的单个请求。

这与比较多个 HTTP/1.1 请求的方法相同（浏览器通常为每个主机打开 4-8 个连接，而不仅仅是一个），除了在 HTTP/2 下打开和管理多个连接没有开销，因为它已经融入协议。而且HTTP/2下没有4-8个限制，通过浏览器和服务器往往会实现一个Apache defaults to 100 for example)。

说了这么多，我仍然认为在客户端和服务器上仍有许多优化工作要做，以充分利用 HTTP/2。互联网还针对 HTTP/1.1 及其工作方式进行了大量优化，因此可能需要撤消或至少调整其中的一些内容，以充分利用 HTTP/2。例如，页面加载通常会加载 html，然后是 CSS，然后是自然导致优先级的图像。在 HTTP/2 下，您可以同时请求所有资源，但实际上应该优先考虑 CSS，例如图像。大多数浏览器都这样做，但它们是否以最优化的方式做到这一点？

【讨论】：

关于您的查询，我在 Chrome 开发工具中使用“禁用缓存”运行它，因此两个 GET 请求都是从同一来源请求的。

这并不意味着两个 GET 请求都是从同一来源请求的 :-) 但我同意这确实意味着它们不是从缓存中读取的。

:-)。做了仔细检查，两者都是从同一来源获取的。此外，我对线头阻塞的担忧基本上是相同的连接似乎用于 H/1.1 和 H/2。那么当使用 H/1.1 时，有可能会出现线头阻塞不是吗？

关于时间，Chrome 开发工具中显示的“加载”时间应该已经考虑到您在 (2a) 和 (2b) 中提到的数字了吧？

我真的怀疑 HTTP/1.1 和 HTTP/2 请求使用相同的连接。我根本看不到服务器会如何处理它！因此，要么您在 Chrome 中发现错误报告协议的错误，要么您误认为它们是同一来源。检查您的服务器日志以查看它认为正在使用的协议。