浏览器渲染原理--HTTP请求流程-2020-09-24

285 阅读2分钟

导向

  1. HTTP协议是一种允许浏览器向服务器请求资源的协议,是web基础。
  2. HTTP协议是建立在TCP连接基础上的,只有TCP成功向服务器建立连接,才能传输数据
  3. HTTP协议是浏览器使用最广泛的协议。

浏览器发起HTTP请求的流程

  1. 构建请求 构建请求行信息:请求方法,请求URL,协议及版本
get /index.html HTTP/1.1
  1. 查找缓存 会先在浏览器缓存中查找是否有请求的文件,浏览器缓存是一种在本地保存资源副本,以供下次请求时直接使用的技术。
  • 有缓存资源,则会拦截请求,返回缓存资源的副本。
  • 没有缓存,进入网络请求过程。
  1. 准备IP地址和端口号
  • HTTP协议和TCP协议的关系: HTTP协议是应用层协议,用来封装请求的文本信息,使用TCP/IP用作传输层协议发到网络上。也就是说:HTTP的内容是通过TCP的传输数据阶段来实现的。 HTTP与TCP关系.PNG
  • DNS(域名解析):域名---IP地址。所以进入网络请求的第一步就是域名解析,取到IP地址后,就可以获取端口号,HTTP协议默认的端口号是80.
  1. 等待TCP队列: Chrome机制,HTTP1.1,同一个域名同时最多只能建立6个TCP连接,超过需要在排队队列中等待。
  2. 三次握手建立TCP连接。
  3. 发送HTTP请求,浏览器和 服务器进行通信,HTTP中的数据就是在这个通信过程中传输的。具有HTTP请求报文:请求行,请求头,请求体

浏览器处理HTTP请求流程

  1. 返回请求 curl -i www.qq.com -i表示返回响应行,响应头,响应体。 image.png
  2. 四次挥手断开连接
connection: keep-alive

如果返回的响应头中含有这个字段,则表示使用长连接,也就是说不断开TCP连接,继续下一次请求,优点:可以省去建立连接的时间,提升资源的加载速度。

总结:

以上,8个步骤就是HTTP请求的流程。

构建请求->查找缓存->DNS解析->等待TCP队列->建立TCP连接->发送HTTP请求->返回请求->断开连接

补充:

  1. 在返回数据时,还可能重定向,根据状态码,301 / 302判断是否是重定向,重定向则浏览器会读取服务器返回的响应头中的Location字段,读取地址,并使用该地址重新导航,重定向流程。
  2. 缓存:DNS缓存(保存在浏览器本地,下次启动依然有效)。页面资源缓存,使用缓存资源是后端设置的,在返回的响应头中可以查看,是否可以进行缓存。cache-control。