全网最经典面试题：从输入URL到页面显示，网络层面发生了什么？（超详细流程图+步骤）

一、前言

这道题是前端、后端、测试、运维面试必考题，几乎100%会问。

“从用户在浏览器输入网址，到页面最终显示出来，中间发生了什么？”

这道题能全面考察你对HTTP、DNS、TCP、IP、ARP、TCP三次握手、TLS/SSL、页面渲染等全流程知识的掌握程度。

我用最清晰的步骤 + 最标准流程图，带你一次性吃透。

二、整体流程总览（一句话概括）

1. DNS 域名解析：域名 → IP
2. TCP 三次握手：建立可靠连接
3. TLS 握手（HTTPS）：加密通道
4. 发送 HTTP 请求
5. 服务器处理并返回响应
6. TCP 四次挥手：断开连接
7. 浏览器解析渲染页面

三、完整流程图

四、详细步骤拆解（序号版，面试直接背）

第1步：浏览器解析 URL

判断是合法 URL，拼接协议（HTTP/HTTPS）。

第2步：DNS 域名解析（域名 → IP）

1. 查浏览器缓存
2. 查本机 hosts
3. 查本地运营商 DNS
4. 查根 DNS → 顶级 DNS → 权威 DNS
5. 最终得到服务器 IP

第3步：TCP 三次握手（建立可靠连接）

浏览器与服务器建立 TCP 连接：

1. 客户端发送 SYN
2. 服务端回复 SYN+ACK
3. 客户端回复 ACK
   连接建立成功

第4步：HTTPS 建立 TLS 加密握手（仅HTTPS）

1. 客户端发送加密套件
2. 服务端返回证书
3. 客户端验证证书
4. 双方生成会话密钥
   后续传输全加密

第5步：浏览器发送 HTTP 请求

发送请求头：

• 请求方法（GET/POST）
• URL
• Cookie、User-Agent 等

第6步：服务器处理请求

服务器接收请求，处理业务逻辑，查询数据库。

第7步：服务器返回 HTTP 响应

返回：

• 状态码 200
• 响应体：HTML/CSS/JS/图片

第8步：TCP 四次挥手（断开连接）

1. 客户端发 FIN
2. 服务端回复 ACK
3. 服务端发 FIN
4. 客户端回复 ACK
   连接关闭

第9步：浏览器解析渲染页面

1. 解析 HTML → 生成 DOM 树
2. 解析 CSS → 生成 CSSOM 树
3. 合成渲染树 Render Tree
4. 布局 Layout（位置大小）
5. 绘制 Paint（像素绘制）
6. 页面完整显示

五、面试满分回答（精简版）

**当用户输入URL并回车后：

1. 浏览器通过DNS解析域名得到服务器IP；
2. 与服务器进行TCP三次握手建立连接；
3. 如果是HTTPS，会进行TLS握手建立加密通道；
4. 浏览器发送HTTP请求；
5. 服务器处理请求并返回HTML等资源；
6. 进行TCP四次挥手断开连接；
7. 浏览器解析HTML、CSS、JS，完成页面渲染并显示。**

六、总结（核心关键词）

• DNS 解析
• TCP 三次握手
• TLS 加密
• HTTP 请求/响应
• TCP 四次挥手
• 浏览器渲染