从计算机网络角度看访问网页全过程
解析URL—生成HTTP请求消息
url的组成部分:
- 协议: URL的开头是协议,它指定了如何访问资源。常见的协议包括
http
(超文本传输协议)、https
(安全的超文本传输协议)、ftp
(文件传输协议)等。协议后跟冒号和两个斜杠,例如https://
。 - 域名: 域名是资源所在服务器的网络地址。在URL中,域名紧跟在协议后面,例如
www.example.com
。域名有时也包括子域名(如www
)。 - 端口: 端口是可选的,位于域名之后,由冒号隔开。如果未指定,HTTP默认使用端口80,HTTPS默认使用端口443。例如
https://www.example.com:443
。 - 路径: 路径指定服务器上资源的具体位置。例如,在
https://www.example.com/index.html
中,/index.html
是路径,指向服务器上名为index.html
的文件。 - 查询字符串: 查询字符串(可选)开始于问号
?
,后跟一个或多个参数,用于传递额外信息给服务器。例如,https://www.example.com/search?q=example
中的q=example
是查询参数,用于搜索关键词。
对URL
进行解析之后,浏览器确定了 Web 服务器和文件路径,接下来就是根据这些信息来生成 HTTP 请求消息了。
DNS解析获取IP
通过浏览器解析 URL 并生成 HTTP 消息后,需要委托操作系统将消息发送给 Web
服务器。
但在发送之前,还有一项工作需要完成,那就是查询服务器域名对应的 IP 地址,因为委托操作系统发送消息时,必须提供通信对象的 IP 地址。详见应用层协议详解
TCP连接
关于TCP报文格式以及其他详细介绍,见传输层协议详解
在 HTTP 传输数据之前,首先需要 TCP 建立连接,TCP 连接的建立,通常称为三次握手
ARP获取MAC
ARP用于将IP地址解析为MAC地址,详细过程见网络层协议详解
HTTP 请求与响应
发送 HTTP 请求
- 构建请求报文:浏览器构建一个 HTTP 请求报文,包括请求行、请求头和请求体。
- 请求行:
GET / HTTP/1.1
- 请求头:包含 Host、User-Agent、Accept 等信息。
- 请求行:
- 发送请求:通过已建立的 TCP 连接,将 HTTP 请求发送到服务器。
服务器处理请求
- 解析请求:服务器接收到 HTTP 请求后,解析请求行和请求头。
- 生成响应:服务器根据请求内容,生成相应的 HTTP 响应报文,包括状态行、响应头和响应体。
- 状态行:
HTTP/1.1 200 OK
- 响应头:包含 Content-Type、Content-Length 等信息。
- 响应体:包含网页的 HTML 内容。
- 状态行:
发送 HTTP 响应
- 通过 TCP 连接:服务器将 HTTP 响应报文通过 TCP 连接发送回客户端。
浏览器渲染网页
解析 HTML
- DOM 树:浏览器解析 HTML,生成 DOM(文档对象模型)树。
- CSSOM 树:解析 CSS,生成 CSSOM(CSS 对象模型)树。
- 渲染树:结合 DOM 树和 CSSOM 树,生成渲染树。
布局与绘制
- 布局:计算每个元素的尺寸和位置。
- 绘制:将渲染树的每个节点绘制到屏幕上。
处理资源
- 外部资源:浏览器遇到
<img>
、<script>
、<link>
等标签时,发送新的 HTTP 请求下载资源。 - 异步请求:如果遇到 JavaScript 发起的异步请求(如 AJAX),则重复 DNS 解析、TCP 连接和 HTTP 请求过程。
TCP 连接断开
TCP连接通过四次挥手断开三次握手和四次挥手 | 星落溪桥
评论