从输入 URL 到页面呈现
当你打开浏览器，在地址栏输入一个网址并按下回车键时，背后发生了一系列复杂而精密的技术流程,这个过程通常可以分为以下六个关键阶段：
DNS 域名解析（寻找 IP 地址）
计算机网络通过 IP 地址（如 192.168.1.1）来定位服务器，但人类习惯使用域名（如 www.google.com）。
- 查询缓存：浏览器首先检查自身缓存、操作系统缓存（Hosts 文件）中是否已有该域名的 IP 记录。
- 递归查询：如果缓存未命中，浏览器会向本地 DNS 服务器发起查询，如果本地 DNS 服务器也没有记录，它会依次向根域名服务器、顶级域名服务器（TLD）和权威域名服务器发起请求，直到找到对应的 IP 地址。
- 返回结果：DNS 服务器将解析到的 IP 地址返回给浏览器。
建立 TCP 连接（三次握手）
获取 IP 地址后，浏览器需要与服务器建立通信链路，通常使用 TCP 协议
。
- 三次握手：
- 第一次握手：客户端发送 SYN 包,询问服务器是否准备好连接。
- 第二次握手：服务器回复 SYN-ACK 包,确认收到并表示准备就绪。
- 第三次握手：客户端回复 ACK 包,连接正式建立。
- HTTPS 加密（TLS 握手）：如果是 HTTPS 网站，在 TCP 连接建立后，还会进行 TLS/SSL 握手，通过交换证书和密钥协商,确保后续数据传输的安全性。
发送 HTTP 请求
连接建立后，浏览器会向服务器发送 HTTP 请求报文。
- 请求行：包含请求方法（如 GET、POST）、请求路径和 HTTP 协议版本。
- 请求头：包含浏览器信息（User-Agent）、支持的编码格式、Cookie 等元数据。
- 请求体：如果是 POST 请求，这里会包含用户提交的数据（如表单内容）。
服务器处理请求
服务器（如 Nginx、Apache）接收到请求后,会进行相应的处理：
- 路由分发：根据 URL 路径找到对应的处理程序。
- 后端逻辑：服务器可能需要查询数据库、调用其他微服务接口或进行复杂的计算。
- 生成响应：服务器将处理结果封装成 HTTP 响应报文。
接收 HTTP 响应
服务器将响应数据发送回浏览器：
- 状态码：服务器会返回一个状态码，200 OK（成功）、404 Not Found（资源不存在）或 500 Internal Server Error（服务器内部错误）。
- 响应头类型（Content-Type，如 text/html）、缓存策略、Set-Cookie 等信息。
- 响应体：这是服务器返回的核心数据，通常是 HTML 代码、CSS 样式表、JavaScript 脚本或图片等资源。
浏览器渲染页面
这是用户感知最直接的阶段,浏览器将接收到的代码转化为可视化的网页：
- 解析 HTML：浏览器解析 HTML 文档，构建 DOM 树（文档对象模型）。
- 解析 CSS：浏览器解析 CSS 样式，构建 CSSOM 树（CSS 对象模型）。
- 合并生成渲染树：将 DOM 树和 CSSOM 树结合，生成 渲染树（Render Tree）。
- 布局（Layout）：计算页面中每个元素在屏幕上的确切位置和大小。
- 绘制（Painting）：将计算好的布局信息转化为屏幕上的像素点,最终呈现出完整的网页。
- 执行 JavaScript：如果页面包含 JavaScript，浏览器会下载并执行脚本，可能会修改 DOM 或 CSSOM,从而触发页面的动态更新。
从输入 URL 到页面显示，是一个跨越网络层、传输层、应用层以及浏览器渲染引擎的协同过程，虽然这一系列步骤听起来繁琐，但在现代网络环境下,通常只需几百毫秒到几秒即可完成。
首发原创文章，作者：王坚，如若转载，请注明出处：https://idctop.com/article/493374.html
