共计 5993 个字符,预计需要花费 15 分钟才能阅读完成。
本文由原作者松若章原创发布,作者主页:zhihu.com/people/hrsonion/posts,感谢原作者的无私分享。
1、引言
一道经典的面试题是:从 URL 在浏览器被被输入到页面展现的过程中发生了什么?
大多数回答都是说请求响应之后 DOM 怎么被构建,被绘制出来。但是你有没有想过,收到的 HTML 如果包含几十个图片标签,这些图片是以什么方式、什么顺序、建立了多少连接、使用什么协议被下载下来的呢?
要搞懂这个问题,我们需要先解决下面五个问题:
1)现代浏览器在与服务器建立了一个 TCP 连接后是否会在一个 HTTP 请求完成后断开?什么情况下会断开?
2)一个 TCP 连接可以对应几个 HTTP 请求?
3)一个 TCP 连接中 HTTP 请求发送可以一起发送么(比如一起发三个请求,再三个响应一起接收)?
4)为什么有的时候刷新页面不需要重新建立 SSL 连接?
5)浏览器对同一 Host 建立 TCP 连接到数量有没有限制?
好了,带着上面的问题,我来阅读本文内容。
(本文同步发布于:http://www.52im.net/thread-26…)
2、相关文章
《网络编程懒人入门(七):深入浅出,全面理解 HTTP 协议》
《从 HTTP/0.9 到 HTTP/2:一文读懂 HTTP 协议的历史演变和设计思路》
《脑残式网络编程入门(三):HTTP 协议必知必会的一些知识》
《脑残式网络编程入门(四):快速理解 HTTP/ 2 的服务器推送(Server Push)》
3、第一个问题:与服务器建立的连接是否会在一个 HTTP 请求后断开?什么情况下断开?
如题所示,先来谈谈第一个问题:现代浏览器在与服务器建立了一个 TCP 连接后是否会在一个 HTTP 请求完成后断开?什么情况下会断开?
在 HTTP/1.0 中,一个服务器在发送完一个 HTTP 响应后,会断开 TCP 链接。但是这样每次请求都会重新建立和断开 TCP 连接,代价过大。所以虽然标准中没有设定,某些服务器对 Connection: keep-alive 的 Header 进行了支持。意思是说,完成这个 HTTP 请求之后,不要断开 HTTP 请求使用的 TCP 连接。这样的好处是连接可以被重新使用,之后发送 HTTP 请求的时候不需要重新建立 TCP 连接,以及如果维持连接,那么 SSL 的开销也可以避免。
下面两张图片是我短时间内两次访问 https://www.github.com 的时间统计:
▲ 头一次访问,有初始化连接和 SSL 开销
▲ 初始化连接和 SSL 开销消失了,说明使用的是同一个 TCP 连接
持久连接:既然维持 TCP 连接好处这么多,HTTP/1.1 就把 Connection 头写进标准,并且默认开启持久连接,除非请求中写明 Connection: close,那么浏览器和服务器之间是会维持一段时间的 TCP 连接,不会一个请求结束就断掉。
所以第一个问题的答案是:默认情况下建立 TCP 连接不会断开,只有在请求报头中声明 Connection: close 才会在请求完成后关闭连接。(详细文档请见:https://tools.ietf.org/html/r…)
4、第二个问题:一个 TCP 连接可以对应几个 HTTP 请求?
了解了第一个问题之后,其实这个问题已经有了答案:如果维持连接,一个 TCP 连接是可以发送多个 HTTP 请求的。
5、第三个问题:一个 TCP 连接中 HTTP 请求发送可以一起发送么?
再来看看第三个问题:一个 TCP 连接中 HTTP 请求发送可以一起发送么(比如一起发三个请求,再三个响应一起接收)?
HTTP/1.1 存在一个问题:单个 TCP 连接在同一时刻只能处理一个请求。
意思是说:两个请求的生命周期不能重叠,任意两个 HTTP 请求从开始到结束的时间在同一个 TCP 连接里不能重叠。
虽然 HTTP/1.1 规范中规定了 Pipelining 来试图解决这个问题,但是这个功能在浏览器中默认是关闭的。
先来看一下 Pipelining 是什么,RFC 2616 中规定了:
原文:A client that supports persistent connections MAY “pipeline” its
requests (i.e., send multiple requests without waiting for each
response). A server MUST send its responses to those requests in the
same order that the requests were received.翻译:一个支持持久连接的客户端可以在一个连接中发送多个请求(不需要等待任意请求的响应)。收到请求的服务器必须按照请求收到的顺序发送响应。
至于标准为什么这么设定,我们可以大概推测一个原因:由于 HTTP/1.1 是个文本协议,同时返回的内容也并不能区分对应于哪个发送的请求,所以顺序必须维持一致。比如你向服务器发送了两个请求 GET /query?q=A 和 GET /query?q=B,服务器返回了两个结果,浏览器是没有办法根据响应结果来判断响应对应于哪一个请求的。
Pipelining 这种设想看起来比较美好,但是在实践中会出现许多问题:
1)一些代理服务器不能正确的处理 HTTP Pipelining;
2)正确的流水线实现是复杂的。详见《HTTP/1.x 的连接管理》;
3)Head-of-line Blocking 连接头阻塞:在建立起一个 TCP
连接之后,假设客户端在这个连接连续向服务器发送了几个请求。按照标准,服务器应该按照收到请求的顺序返回结果,假设服务器在处理首个请求时花费了大量时间,那么后面所有的请求都需要等着首个请求结束才能响应。
所以现代浏览器默认是不开启 HTTP Pipelining 的。
但是,HTTP2 提供了 Multiplexing 多路传输特性,可以在一个 TCP 连接中同时完成多个 HTTP 请求。至于 Multiplexing 具体怎么实现的就是另一个问题了。我们可以看一下使用 HTTP2 的效果。
▲ 绿色是发起请求到请求返回的等待时间,蓝色是响应的下载时间,可以看到都是在同一个 Connection,并行完成的
所以这个问题也有了答案:在 HTTP/1.1 存在 Pipelining 技术可以完成这个多个请求同时发送,但是由于浏览器默认关闭,所以可以认为这是不可行的。在 HTTP2 中由于 Multiplexing 特点的存在,多个 HTTP 请求可以在同一个 TCP 连接中并行进行。
那么在 HTTP/1.1 时代,浏览器是如何提高页面加载效率的呢?
主要有下面两点:
1)维持和服务器已经建立的 TCP 连接,在同一连接上顺序处理多个请求;
2)和服务器建立多个 TCP 连接。
6、第四个问题:为什么有的时候刷新页面不需要重新建立 SSL 连接?
在第一个问题的讨论中已经有答案了:TCP 连接有的时候会被浏览器和服务端维持一段时间。TCP 不需要重新建立,SSL 自然也会用之前的。
7、第五个问题:浏览器对同一 Host 建立 TCP 连接到数量有没有限制?
假设我们还处在 HTTP/1.1 时代,那个时候没有多路传输,当浏览器拿到一个有几十张图片的网页该怎么办呢?
肯定不能只开一个 TCP 连接顺序下载,那样用户肯定等的很难受,但是如果每个图片都开一个 TCP 连接发 HTTP 请求,那电脑或者服务器都可能受不了,要是有 1000 张图片的话总不能开 1000 个 TCP 连接吧,你的电脑同意 NAT 也不一定会同意。
所以答案是:有。Chrome 最多允许对同一个 Host 建立六个 TCP 连接。不同的浏览器有一些区别,详见:https://developers.google.com…。
那么回到最开始的问题:收到的 HTML 如果包含几十个图片标签,这些图片是以什么方式、什么顺序、建立了多少连接、使用什么协议被下载下来的呢?
如果图片都是 HTTPS 连接并且在同一个域名下,那么浏览器在 SSL 握手之后会和服务器商量能不能用 HTTP2,如果能的话就使用 Multiplexing 功能在这个连接上进行多路传输。不过也未必会所有挂在这个域名的资源都会使用一个 TCP 连接去获取,但是可以确定的是 Multiplexing 很可能会被用到。
如果发现用不了 HTTP2 呢?或者用不了 HTTPS(现实中的 HTTP2 都是在 HTTPS 上实现的,所以也就是只能使用 HTTP/1.1)。那浏览器就会在一个 HOST 上建立多个 TCP 连接,连接数量的最大限制取决于浏览器设置,这些连接会在空闲的时候被浏览器用来发送新的请求,如果所有的连接都正在发送请求呢?那其他的请求就只能等等了。
附录:更多网络编程基础资料
《TCP/IP 详解 – 第 11 章·UDP:用户数据报协议》
《TCP/IP 详解 – 第 17 章·TCP:传输控制协议》
《TCP/IP 详解 – 第 18 章·TCP 连接的建立与终止》
《TCP/IP 详解 – 第 21 章·TCP 的超时与重传》
《技术往事:改变世界的 TCP/IP 协议(珍贵多图、手机慎点)》
《通俗易懂 - 深入理解 TCP 协议(上):理论基础》
《通俗易懂 - 深入理解 TCP 协议(下):RTT、滑动窗口、拥塞处理》
《理论经典:TCP 协议的 3 次握手与 4 次挥手过程详解》
《理论联系实际:Wireshark 抓包分析 TCP 3 次握手、4 次挥手过程》
《计算机网络通讯协议关系图(中文珍藏版)》
《UDP 中一个包的大小最大能多大?》
《P2P 技术详解(一):NAT 详解——详细原理、P2P 简介》
《P2P 技术详解 (二):P2P 中的 NAT 穿越(打洞) 方案详解》
《P2P 技术详解(三):P2P 技术之 STUN、TURN、ICE 详解》
《通俗易懂:快速理解 P2P 技术中的 NAT 穿透原理》
《高性能网络编程(一):单台服务器并发 TCP 连接数到底可以有多少》
《高性能网络编程(二):上一个 10 年,著名的 C10K 并发连接问题》
《高性能网络编程(三):下一个 10 年,是时候考虑 C10M 并发问题了》
《高性能网络编程(四):从 C10K 到 C10M 高性能网络应用的理论探索》
《高性能网络编程(五):一文读懂高性能网络编程中的 I / O 模型》
《高性能网络编程(六):一文读懂高性能网络编程中的线程模型》
《不为人知的网络编程(一):浅析 TCP 协议中的疑难杂症(上篇)》
《不为人知的网络编程(二):浅析 TCP 协议中的疑难杂症(下篇)》
《不为人知的网络编程(三):关闭 TCP 连接时为什么会 TIME_WAIT、CLOSE_WAIT》
《不为人知的网络编程(四):深入研究分析 TCP 的异常关闭》
《不为人知的网络编程(五):UDP 的连接性和负载均衡》
《不为人知的网络编程(六):深入地理解 UDP 协议并用好它》
《不为人知的网络编程(七):如何让不可靠的 UDP 变的可靠?》
《不为人知的网络编程(八):从数据传输层深度解密 HTTP》
《网络编程懒人入门(一):快速理解网络通信协议(上篇)》
《网络编程懒人入门(二):快速理解网络通信协议(下篇)》
《网络编程懒人入门(三):快速理解 TCP 协议一篇就够》
《网络编程懒人入门(四):快速理解 TCP 和 UDP 的差异》
《网络编程懒人入门(五):快速理解为什么说 UDP 有时比 TCP 更有优势》
《网络编程懒人入门(六):史上最通俗的集线器、交换机、路由器功能原理入门》
《网络编程懒人入门(七):深入浅出,全面理解 HTTP 协议》
《网络编程懒人入门(八):手把手教你写基于 TCP 的 Socket 长连接》
《网络编程懒人入门(九):通俗讲解,有了 IP 地址,为何还要用 MAC 地址?》
《技术扫盲:新一代基于 UDP 的低延时网络传输层协议——QUIC 详解》
《让互联网更快:新一代 QUIC 协议在腾讯的技术实践分享》
《现代移动端网络短连接的优化手段总结:请求速度、弱网适应、安全保障》
《聊聊 iOS 中网络编程长连接的那些事》
《移动端 IM 开发者必读(一):通俗易懂,理解移动网络的“弱”和“慢”》
《移动端 IM 开发者必读(二):史上最全移动弱网络优化方法总结》
《IPv6 技术详解:基本概念、应用现状、技术实践(上篇)》
《IPv6 技术详解:基本概念、应用现状、技术实践(下篇)》
《从 HTTP/0.9 到 HTTP/2:一文读懂 HTTP 协议的历史演变和设计思路》
《脑残式网络编程入门(一):跟着动画来学 TCP 三次握手和四次挥手》
《脑残式网络编程入门(二):我们在读写 Socket 时,究竟在读写什么?》
《脑残式网络编程入门(三):HTTP 协议必知必会的一些知识》
《脑残式网络编程入门(四):快速理解 HTTP/ 2 的服务器推送(Server Push)》
《脑残式网络编程入门(五):每天都在用的 Ping 命令,它到底是什么?》
《脑残式网络编程入门(六):什么是公网 IP 和内网 IP?NAT 转换又是什么鬼?》
《以网游服务端的网络接入层设计为例,理解实时通信的技术挑战》
《迈向高阶:优秀 Android 程序员必知必会的网络基础》
《全面了解移动端 DNS 域名劫持等杂症:技术原理、问题根源、解决方案等》
《美图 App 的移动端 DNS 优化实践:HTTPS 请求耗时减小近半》
《Android 程序员必知必会的网络通信传输层协议——UDP 和 TCP》
《IM 开发者的零基础通信技术入门(一):通信交换技术的百年发展史(上)》
《IM 开发者的零基础通信技术入门(二):通信交换技术的百年发展史(下)》
《IM 开发者的零基础通信技术入门(三):国人通信方式的百年变迁》
《IM 开发者的零基础通信技术入门(四):手机的演进,史上最全移动终端发展史》
《IM 开发者的零基础通信技术入门(五):1G 到 5G,30 年移动通信技术演进史》
《IM 开发者的零基础通信技术入门(六):移动终端的接头人——“基站”技术》
《IM 开发者的零基础通信技术入门(七):移动终端的千里马——“电磁波”》
《IM 开发者的零基础通信技术入门(八):零基础,史上最强“天线”原理扫盲》
《IM 开发者的零基础通信技术入门(九):无线通信网络的中枢——“核心网”》
《IM 开发者的零基础通信技术入门(十):零基础,史上最强 5G 技术扫盲》
《IM 开发者的零基础通信技术入门(十一):为什么 WiFi 信号差?一文即懂!》
《IM 开发者的零基础通信技术入门(十二):上网卡顿?网络掉线?一文即懂!》
《IM 开发者的零基础通信技术入门(十三):为什么手机信号差?一文即懂!》
《IM 开发者的零基础通信技术入门(十四):高铁上无线上网有多难?一文即懂!》
《IM 开发者的零基础通信技术入门(十五):理解定位技术,一篇就够》
《百度 APP 移动端网络深度优化实践分享(一):DNS 优化篇》
《百度 APP 移动端网络深度优化实践分享(二):网络连接优化篇》
《百度 APP 移动端网络深度优化实践分享(三):移动端弱网优化篇》
《技术大牛陈硕的分享:由浅入深,网络编程学习经验干货总结》
《可能会搞砸你的面试:你知道一个 TCP 连接上能发起多少个 HTTP 请求吗?》
更多同类文章 ……
(本文同步发布于:http://www.52im.net/thread-26…)