网络请求篇：从输入 URL 到页面加载

2024-02-21 20:47:40

从输入 URL 到页面加载是一个复杂的过程，涉及到多个步骤和组件。其中，网络请求是关键的一环。本文将详细介绍网络请求的过程，帮助读者了解网页加载的原理，以及如何优化网页加载性能。

一、DNS 查询

当用户在浏览器中输入一个 URL 时，浏览器首先会查询自身的 DNS 缓存。如果在缓存中找到对应的 IP 地址，则直接使用该 IP 地址连接到服务器。如果浏览器缓存中没有找到对应的 IP 地址，则搜索系统自身的 DNS 缓存。如果在系统 DNS 缓存中找到对应的 IP 地址，则直接使用该 IP 地址连接到服务器。如果在系统 DNS 缓存中也没有找到对应的 IP 地址，则浏览器会向 DNS 服务器发送 DNS 查询请求。DNS 服务器会将域名解析为对应的 IP 地址，然后浏览器再使用该 IP 地址连接到服务器。

二、TCP 连接

浏览器与服务器建立连接后，需要进行 TCP 三次握手，以确保连接的可靠性。TCP 三次握手包括：

客户端向服务器发送 SYN（同步）包，其中包含客户端的初始序号。
服务器收到 SYN 包后，向客户端发送 SYN-ACK（同步确认）包，其中包含服务器的初始序号和对客户端初始序号的确认。
客户端收到 SYN-ACK 包后，向服务器发送 ACK（确认）包，其中包含对服务器初始序号的确认。

经过三次握手后，客户端与服务器之间建立起可靠的 TCP 连接。

三、HTTP 请求

TCP 连接建立后，浏览器向服务器发送 HTTP 请求。HTTP 请求包括请求方法、请求路径、HTTP 版本、请求头和请求体。请求方法有 GET、POST、PUT、DELETE 等，用于指定对服务器的操作。请求路径是服务器上的资源路径。HTTP 版本是 HTTP 协议的版本，如 HTTP/1.1、HTTP/2 等。请求头包含一些附加信息，如请求的语言、用户代理等。请求体包含需要发送给服务器的数据。

四、HTTP 响应

服务器收到 HTTP 请求后，会进行处理并向浏览器发送 HTTP 响应。HTTP 响应包括响应状态码、响应头和响应体。响应状态码表示服务器对请求的处理结果，如 200 表示请求成功、404 表示请求的资源不存在等。响应头包含一些附加信息，如响应的类型、长度等。响应体包含服务器返回的数据。

五、页面加载

浏览器收到 HTTP 响应后，会将响应体解析为 HTML、CSS、JavaScript 等资源。然后，浏览器会根据 HTML 代码构建 DOM 树，并根据 CSS 代码渲染 DOM 树。最后，浏览器会执行 JavaScript 代码，并在页面上显示相应的内容。

网络请求是网页加载过程中至关重要的一环。通过优化网络请求，可以有效地提高网页加载性能。一些常见的优化方法包括：