从浏览器输入URL到页面加载的具体流程(http协议)

Posted 2021-09-09 bamboo

从浏览器输入URL到页面加载的具体流程(http协议)

• 域名解析
• 建立TCP连接
• 浏览器发送HTTP请求
• 服务器处理请求并返回HTTP报文
• 浏览器解析渲染页面
• 连接结束

1.域名解析

域名在解析的过程中会有多级缓存，首先浏览器会查找自身缓存中是否存在对应的ip信息，若没有则会进一步向操作系统的缓存要，还没有的话，则会检查本机的域名解析文件hosts,看是否存在对应的域名 - ip配置信息。

如果通过以上步骤仍然无法获取域名对应的ip地址，则会主动向DNS服务器发起请求，获取IP地址。

DNS 域名系统（Domain Name System）是互联网的一项服务。它作为将域名和IP地址相互映射的一个分布式数据库，能够使人更方便地访问互联网。

以查询 zh.wikipedia.org 为例：

• 客户端发送查询报文"query zh.wikipedia.org"至DNS服务器，DNS服务器首先检查自身缓存，如果存在记录则直接返回结果。
• 如果记录老化或不存在，则：
  DNS服务器向根域名服务器发送查询报文"query zh.wikipedia.org"，根域名服务器返回顶级域 .org 的顶级域名服务器地址。
• DNS服务器向 .org 域的顶级域名服务器发送查询报文"query zh.wikipedia.org"，得到二级域 .wikipedia.org 的权威域名服务器地址。
• DNS服务器向 .wikipedia.org 域的权威域名服务器发送查询报文"query zh.wikipedia.org"，得到主机 zh 的A记录，存入自身缓存并返回给客户端。

2.建立TCP连接

HTTP协议是在TCP/IP协议的基础上运行的，依靠TCP/IP协议进行可靠的数据传输，因此浏览器在发送请求前，需要先建立TCP连接。

建立TCP连接流程(三次握手)：

• 客户端（通过执行connect函数）向服务器端发送一个SYN包，请求一个主动打开。该包携带客户端为这个连接请求而设定的随机数A作为消息序列号。
• 服务器端收到一个合法的SYN包后，把该包放入SYN队列中；回送一个SYN/ACK。ACK的确认码应为A+1，SYN/ACK包本身携带一个随机产生的序号B。
• 客户端收到SYN/ACK包后，发送一个ACK包，该包的序号被设定为A+1，而ACK的确认码则为B+1。然后客户端的connect函数成功返回。当服务器端收到这个ACK包的时候，把请求帧从SYN队列中移出，放至ACCEPT队列中；这时accept函数如果处于阻塞状态，可以被唤醒，从ACCEPT队列中取出ACK包，重新创建一个新的用于双向通信的sockfd，并返回。

3.浏览器发送HTTP请求

TCP连接构建成功后，浏览器根据HTTP协议规定的格式，构建HTTP请求报文并通过TCP协议发送到服务器指定端口，请求报文由三部分组成：请求行、请求报头和请求正文。

• 请求行：描述请求或响应的基本信息。
• 头部字段集合：使用 key-value 形式更详细地说明报文。
• 消息正文：实际传输的数据，它不一定是纯文本，可以是图片、视频等二进制数据。

4.服务器处理请求并返回HTTP报文

HTTP响应报文由三部分组成：

• 状态行：版本号、状态码、原因。
• 响应头部字段：使用 key-value 形式更详细地说明报文。
• 响应正文：服务器发送给浏览器的内容。

5.浏览器解析渲染页面

简要流程：

• html解析与DOM树构建
• CSS解析
• 渲染

6.连接结束

TCP四次挥手，结束连接。