从输入 URL 到页面加载：浏览器背后的神奇之旅

本文链接：https://blog.youkuaiyun.com/misstianyun/article/details/144009651

当你在浏览器的地址栏中输入一个 URL 并按下回车键后，浏览器会经历一系列复杂的步骤来加载和显示网页。以下是详细的流程：

1. 解析 URL

URL 分解：浏览器首先解析你输入的 URL，将其分解为主机名（域名）、端口号（默认为 80 对于 HTTP，443 对于 HTTPS）、路径和查询参数等部分。
- 例如，对于 https://www.example.com/path?query=param，解析结果为：
  - 协议：https
  - 主机名：www.example.com
  - 端口：443（默认）
  - 路径：/path
  - 查询参数：query=param

2. DNS 解析

DNS 查询：浏览器需要将主机名（域名）转换为 IP 地址。它会向 DNS 服务器发送请求，获取对应的 IP 地址。
- 如果浏览器的缓存中有该域名的 IP 地址，可以直接使用缓存中的信息。
- 否则，浏览器会向本地 DNS 缓存、ISP 的 DNS 服务器或公共 DNS 服务器（如 Google 的 8.8.8.8）发送查询请求，直到找到正确的 IP 地址。

3. 建立 TCP 连接

三次握手：浏览器使用获取到的 IP 地址与目标服务器建立 TCP 连接。TCP 连接通过三次握手过程建立：
1. 浏览器发送 SYN（同步）包到服务器。
2. 服务器回应 SYN-ACK（同步-确认）包。
3. 浏览器发送 ACK（确认）包，连接建立成功。

4. 发送 HTTP/HTTPS 请求

HTTP/HTTPS 请求：连接建立后，浏览器向服务器发送 HTTP 或 HTTPS 请求。请求中包含请求方法（如 GET）、URL、HTTP 头部信息等。

例如：

GET /path?query=param HTTP/1.1
Host: www.example.com
Connection: keep-alive
Accept: text/html,application/xhtml+xml,application/xml;q=0.9,image/webp,*/*;q=0.8
User-Agent: Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/58.0.3029.110 Safari/537.3

5. 服务器处理请求

请求处理：服务器收到请求后，根据请求的 URL 和方法，处理请求并生成响应。
- 服务器可能从文件系统中读取静态文件，或者调用后端服务（如数据库、API 等）生成动态内容。

6. 发送 HTTP/HTTPS 响应

响应生成：服务器生成 HTTP 响应，包含状态码、响应头部和响应体。

例如：

HTTP/1.1 200 OK
Date: Mon, 24 Nov 2024 16:40:00 GMT
Server: Apache/2.4.41 (Ubuntu)
Content-Type: text/html; charset=UTF-8
Content-Length: 1234

<!DOCTYPE html>
<html>
<head>
    <title>Example Page</title>
</head>
<body>
    <h1>Welcome to Example Page</h1>
</body>
</html>