从输入 URL 到页面显示的过程

问题

从浏览器输入网址到看到页面，中间经历了哪些步骤？

解答

整个过程可以分为 6 个阶段：DNS 解析、TCP 连接、HTTP 请求、服务器响应、页面渲染、连接结束。

DNS 解析

DNS 解析是将域名转换为 IP 地址的过程。比如输入 www.baidu.com，需要找到对应的 IP 地址才能访问服务器。

解析流程（递归查询）：

1. 浏览器缓存
2. 系统缓存
3. 路由器缓存
4. ISP 服务器缓存
5. 根域名服务器（.）
6. 顶级域名服务器（.com）
7. 主域名服务器（baidu.com）
8. 子域名服务器（www.baidu.com）

找到 IP 后会缓存到本地，下次访问直接使用。

DNS 优化：

• DNS 缓存：多级缓存机制减少查询时间
• DNS 负载均衡：大型网站返回不同服务器 IP，根据负载量和地理位置分配流量

TCP 连接

TCP 通过三次握手建立可靠连接。

三次握手：

1. 客户端发送 SYN 包（Seq=x），进入 SYN_SEND 状态
2. 服务器返回 SYN+ACK 包（Seq=y, ack=x+1），进入 SYN_RECV 状态
3. 客户端发送 ACK 包（ack=y+1），双方进入 ESTABLISHED 状态

连接建立后开始传输数据。

四次挥手：

1. 客户端发送 FIN 包（seq=u），进入 FIN-WAIT-1 状态
2. 服务器返回 ACK 包（ack=u+1），进入 CLOSE-WAIT 状态，客户端进入 FIN-WAIT-2 状态
3. 服务器发送 FIN 包（seq=w），进入 LAST-ACK 状态
4. 客户端返回 ACK 包（ack=w+1），进入 TIME-WAIT 状态，等待 2*MSL 后进入 CLOSED 状态

服务器收到最后的 ACK 后立即进入 CLOSED 状态。

发送 HTTP 请求

构建 HTTP 请求报文，通过 TCP 连接发送到服务器指定端口。

请求报文结构：

• 请求行：方法、URL、协议版本
• 请求头：Host、User-Agent、Cookie 等
• 请求体：POST 数据等

服务器处理请求

Web 服务器（如 Nginx、Apache、Tomcat）接收 TCP 连接，解析 HTTP 协议，处理请求并生成响应。

响应报文结构：

• 状态行：协议版本、状态码、状态描述
• 响应头：Content-Type、Set-Cookie 等
• 响应体：HTML、JSON 等数据

浏览器渲染页面

浏览器（如 Webkit）按以下步骤渲染：

1. 解析 HTML 生成 DOM 树
2. 解析 CSS 生成 CSSOM 树
3. 合并 DOM 树和 CSSOM 树生成渲染树
4. 计算布局（Layout）
5. 绘制页面（Paint）

连接结束

页面加载完成后，如果没有持久连接需求，通过四次挥手关闭 TCP 连接。

关键点

• DNS 解析是递归查询过程，通过多级缓存优化性能
• TCP 三次握手建立连接，四次挥手断开连接，保证数据可靠传输
• HTTP 请求和响应都包含报文头和报文体，状态码表示处理结果
• 浏览器渲染分为构建 DOM 树、CSSOM 树、渲染树，最后布局和绘制
• DNS 负载均衡可以根据服务器负载和地理位置分配流量