一次网络请求的全过程

1. 输入网址
2. 递归搜索DNS
3. 找到IP地址
4. 发起TCP请求
5. 三次握手建立连接
6. 发送HTTP请求
7. 服务器返回响应
8. 浏览器解析(其中js阻塞浏览器加载)

[外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-Uvs94Mr9-1579231223226)(https://raw.githubusercontent.com/zhangyiming748/learning_notes/master/%E7%BD%91%E7%BB%9C/HttpRequest.jpg)]

---

1. 用户输入url,浏览器内部代码将url进行拆分解析
   |1|2|3|4|5|6|7|8|
   |:–????:–????:–????:–????:–????:–????:–????:–????
   |scheme|://|login:password|@address|:port|/path/to/resource/|?query_string|#fragment|
   |协议名称|层级URL标记符号|访问资源需要的凭证信息|服务器地址|端口号|指向资源的路径|查询字符串|书签|

2. 浏览器首先去找本地的hosts文件,检查在该文件中是否有相应的域名. IP对应关系,如果有,则向其IP地址发送请求,如果没有就会将domain(域)发送给 dns(域名服务器)进行解析(解析如下图),将域名解析成对应的服务器IP地址,发回给浏览器[外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-8twHNJNs-1579231223227)(https://raw.githubusercontent.com/zhangyiming748/learning_notes/master/%E7%BD%91%E7%BB%9C/DNS.jpg)]

3. 接下来就是网络通信

   1. 应用层客户端发送HTTP请求,包头包含请求的方法,目标url,协议,是否需要缓存. cookie,浏览器UA,首选语言等
   2. 传输层TCP传输报文,位于传输层的TCP协议为传输报文提供可靠的字节流服务.它为了方便传输,将大块的数据分割成以报文段为单位的数据包进行管理,并为它们编号,方便服务器接收时能准确地还原报文信息.TCP协议通过"三次握手"等方法保证传输的安全可靠.

   客户端发送一个带有SYN标志的数据包给服务端,在一定的延迟时间内等待接收的回复.服务端收到后,回传一个带有SYN/ACK标志的数据包以示传达确认信息,最后客户端再回传一个带ACK标志的数据包,代表握手结束,连接成功.

   SYN(Synchronize Sequence Numbers)同步序列编号

   ACK (Acknowledgement)确认字符

   客户端:"你好,在家不,有你快递."---SYN
   
   服务端:"在的,送来就行."-----SYN/ACK
   
   客户端:"好嘞."-----ACK
   

   3. 网络层IP协议查询MAC地址,IP协议的作用是把TCP分割好的各种数据包传送给接收方.而要保证确实能传到接收方还需要接收方的MAC地址,也就是物理地址.IP地址和MAC地址是一一对应的关系,一个网络设备的IP地址可以更换,但是MAC地址一般是固定不变的.ARP协议可以将IP地址解析成对应的MAC地址.当通信的双方不在同一个局域网时,需要多次中转才能到达最终的目标,在中转的过程中需要通过下一个中转站的MAC地址来搜索下一个中转目标

   4. 数据到达数据链路层,在找到对方的MAC地址后,就将数据发送到数据链路层传输.这时,客户端发送请求的阶段结束

   5. 服务器接收数据,接收端的服务器在链路层接收到数据包,再层层向上直到应用层.这过程中包括在运输层通过TCP协议将分段的数据包重新组成原来的HTTP请求报文.

   6. 服务器响应请求,服务接收到客户端发送的HTTP请求后,查找客户端请求的资源,并返回响应报文,响应报文中包括一个重要的信息——状态码.状态码由三位数字组成,
      其中比较常见的是200 OK表示请求成功.
      301表示永久重定向,即请求的资源已经永久转移到新的位置.在返回301状态码的同时,响应报文也会附带重定向的url,客户端接收到后将http请求的url做相应的改变再重新发送.
      404 not found 表示客户端请求的资源找不到.

   7. 服务器返回相应文件服务器端收到请求后的由web服务器(准确说应该是http服务器)处理请求,诸如Apache. Ngnix. IIS等.web服务器解析用户请求,知道了需要调度哪些资源文件,再通过相应的这些资源文件处理用户请求和参数,并调用数据库信息,最后将结果通过web服务器返回给浏览器客户端.

   8. 关闭TCP连接,为了避免服务器与客户端双方的资源占用和损耗,当双方没有请求或响应传递时,任意一方都可以发起关闭请求.与创建TCP连接的3次握手类似,关闭TCP连接,需要4次握手

   
   客户端:"兄弟,我这边没数据要传了,咱关闭连接吧."----FIN
   
   服务端:"收到,我看看我这边有木有数据了."----ACK
   
   服务端:"兄弟,我这边也没数据要传你了,咱可以关闭连接了."----FIN
   
   客户端:"好嘞."----ACK
   
   

4. 页面的渲染阶段

   1. 解析HTML生成DOM树.
   2. 解析CSS生成CSSOM规则树.
   3. 将DOM树与CSSOM规则树合并在一起生成渲染树.
   4. 遍历渲染树开始布局,计算每个节点的位置大小信息.
   5. 将渲染树每个节点绘制到屏幕.