从输入一个URL地址到浏览器完成渲染的整个过程

kingcwt2020-3-5前端javascript

一 、简答版

1 浏览器地址栏输入url并回车
2 查找当前url是否存在缓存,缓存是否过期
3 dns解析url对应的ip
4 根据ip建立tcp连接(三次握手)
5 发送http请求
6 服务器处理请求,浏览器接受http响应
7 浏览器解析并渲染页面
8 关闭tcp连接(四次挥手)

二 、DNS解析

每一个网址都有对应的ip地址,dns解析实际上就是寻找你所需要资源的过程,所谓解析就是网址和ip地址的转换。

具体解析过程(dns缓存)

假设输入www.baidu.com,首先会去 浏览器缓存中查找->系统缓存中查找->路由器缓存中查找->本地域名服务器查找->根域名服务器查找->顶级域名服务器查找->主域名服务器查找,如此的类推下去,直到找到IP地址,然后把它记录在本地。

.->.com->baidu.com->www.baidu.com

dns负载均衡

当你访问www.baidu.com。每次响应的并非同一个服务器(ip不同),一般大公司会有成百上千台服务器来支撑访问,dns可以返回一个合适的机器ip给用户,例如可以根据每台机器的负载量,该机器距离用户的距离等等,这种过程就是dns负载均衡。

三 、TCP连接

tcp传输控制协议Transimision Control Protocal可靠、面向连接的协议,传输效率低 (在不可靠的 IP 层上建立可靠的传输层)。 TCP提供全双工服务,即数据可在同一时间双向传播

tcp头图
  • 源端口号和目标端口号:指代的是发送方随机端口,目标端对应的端口
  • 序列号:32位序列号是用于对数据包进行标记,方便重组
  • 确认序列号:期望发送方下一个发送的数据的编号
  • 4位首部长度:单位是字节,4位最大能表示15,所以头部长度最大为60
  • URG :紧急信号、 ACK :确认信号、 PSH :应该从TCP缓冲区读走数据、 RST :断开重新 连接、 SYN :建立连接、 FIN :表示要断开
  • 窗口大小: 当网络通畅时将这个窗口值变大加快传输速度,当网络不稳定时减少这个值。在TCP中起到流量控制作用。
  • 校验和:用来做差错控制,看传输的报文段是否损坏
  • 紧急指针:用来发送紧急数据使用

三次握手

第一次握手:客户端发送syn包(Seq=x)到服务器,并进入SYN_SEND状态,等待服务器确认;【seq=0】
第二次握手:服务器收到syn包,必须确认客户的SYN(ack=x+1),同时自己也发送一个SYN包(Seq=y),即SYN+ACK包,此时服务器进入SYN_RECV状态;[seq=0 ack=1]
第三次握手:客户端收到服务器的SYN+ACK包,向服务器发送确认包ACK(ack=y+1),此包发送完毕,客户端和服务器进入ESTABLISHED状态,完成三次握手。[seq=1 ack=1]

tcp三次挥手图

四次挥手

第一次挥手:客户端发送一个FIN,用来关闭客户端到服务器的数据传送,也就是客户端告诉服务器:我已经不会再给你发数据了。(当然,在fin包之前发送出去的数据,如果没有收到对应的ack确认报文,客户端依然会重发这些数据),但是,此时客户端还可以接受数据。
第二次挥手:服务器收到FIN包后,发送一个ACK给对方并且带上自己的序列号seq,确认序号为收到序号+1。(客户端已经没有数据要发送了,但是服务器若发送数据,客户端依然要接受)。
第三次挥手:服务器发送一个FIN,用来关闭服务器到客户端的数据传送,也就是告诉客户端,我的数据也发送完了,不会再给你发数据了。
第四次挥手:客户端收到服务器返回的FIN后,发送一个ACK给服务器端。(注意此时TCP连接还没有释放,必须经过2∗MSL(最长报文段寿命)的时间后,当客户端撤销相应的TCB后,才进入CLOSED状态,服务器只要收到了客户端发出的确认,立即进入CLOSED状态。同样,撤销TCB后,就结束了这次的TCP连接。可以看到,服务器结束TCP连接的时间要比客户端早一些)。

tcp四次挥手图

为什么会采用三次握手,若采用二次握手可以吗? 四次呢?

采用三次握手是为了防止失效的连接请求报文段突然又传送到主机B,因而产生错误。失效的连接请求报文段是指:主机A发出的连接请求没有收到主机B的确认,于是经过一段时间后,主机A又重新向主机B发送连接请求,且建立成功,顺序完成数据传输。考虑这样一种特殊情况,主机A第一次发送的连接请求并没有丢失,而是因为网络节点导致延迟达到主机B,主机B以为是主机A又发起的新连接,于是主机B同意连接,并向主机A发回确认,但是此时主机A根本不会理会,主机B就一直在等待主机A发送数据,导致主机B的资源浪费。

采用两次握手不行,原因就是上面说的失效的连接请求的特殊情况。而在三次握手中, client和server都有一个发syn和收ack的过程, 双方都是发后能收, 表明通信则准备工作OK.

为什么不是四次握手呢? 大家应该知道通信中著名的蓝军红军约定, 这个例子说明, 通信不可能100%可靠, 而上面的三次握手已经做好了通信的准备工作, 再增加握手, 并不能显著提高可靠性, 而且也没有必要。

为什么客户端最后还要等待2MSL?

MSL(Maximum Segment Lifetime),TCP允许不同的实现可以设置不同的MSL值。

第一,保证客户端发送的最后一个ACK报文能够到达服务器,因为这个ACK报文可能丢失,站在服务器的角度看来,我已经发送了FIN+ACK报文请求断开了,客户端还没有给我回应,应该是我发送的请求断开报文它没有收到,于是服务器又会重新发送一次,而客户端就能在这个2MSL时间段内收到这个重传的报文,接着给出回应报文,并且会重启2MSL计时器。
第二,防止类似与“三次握手”中提到了的“已经失效的连接请求报文段”出现在本连接中。客户端发送完最后一个确认报文后,在这个2MSL时间中,就可以使本连接持续的时间内所产生的所有报文段都从网络中消失。这样新的连接中不会出现旧连接的请求报文。

为什么建立连接是三次握手,关闭连接确是四次挥手呢?

建立连接的时候, 服务器在LISTEN状态下,收到建立连接请求的SYN报文后,把ACK和SYN放在一个报文里发送给客户端。 而关闭连接时,服务器收到对方的FIN报文时,仅仅表示对方不再发送数据了但是还能接收数据,而自己也未必全部数据都发送给对方了,所以己方可以立即关闭,也可以发送一些数据给对方后,再发送FIN报文给对方来表示同意现在关闭连接,因此,己方ACK和FIN一般都会分开发送,从而导致多了一次。

参考文章:
史上最详细的经典面试题 从输入URL到看到页面发生了什么?
在浏览器地址栏输入一个URL后回车,背后会进行哪些技术步骤?

Last Updated 10/16/2023, 7:06:22 AM
What do you think?
  • 0
  • 0
  • 0
  • 0
  • 0
  • 0
Comments
  • Latest
  • Oldest
  • Hottest
Powered by Waline v2.15.8