Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

输入域名-网页显示过程 #857

Open
guanhui07 opened this issue Nov 30, 2024 · 0 comments
Open

输入域名-网页显示过程 #857

guanhui07 opened this issue Nov 30, 2024 · 0 comments
Labels

Comments

@guanhui07
Copy link
Owner

-DNS、HTTP、CA、TLS、HTTPS

DNS(域名系统)查询(1 - 2 步)

当用户在浏览器中输入网址(如www.example.com)后,浏览器首先会进行 DNS 查询。这是因为浏览器需要将域名转换为对应的 IP 地址,才能找到服务器。
浏览器会先检查本地缓存,看是否已经有该域名对应的 IP 地址记录。如果有,就直接使用这个 IP 地址,这是第 1 步。
如果本地缓存没有,浏览器会向操作系统的 DNS 缓存询问。如果操作系统缓存中有,就获取 IP 地址,这也可以看作是第 1 步的一种情况。
如果操作系统缓存也没有,浏览器会向本地域名服务器(通常由互联网服务提供商 ISP 提供)发送 DNS 查询请求。本地域名服务器会进行递归查询或迭代查询来获取 IP 地址,这是第 2 步。

建立 TCP 连接(3 步)

一旦获取到服务器的 IP 地址,浏览器就会通过 TCP(传输控制协议)协议与服务器建立连接。这是第 3 步。
浏览器会向服务器发送一个 SYN(同步)包,服务器收到后会返回一个 SYN - ACK(同步 - 确认)包,浏览器再发送一个 ACK(确认)包,完成 TCP 的三次握手,从而建立起可靠的连接。

HTTP/HTTPS 请求(4 - 5 步)

如果是普通的 HTTP 请求,浏览器会直接向服务器发送 HTTP 请求,这是第 4 步。请求中包含请求方法(如 GET、POST 等)、请求头(包含浏览器信息、接受的数据格式等)和请求体(如果是 POST 等有请求体的请求)。
如果是 HTTPS 请求,还会涉及到 TLS(传输层安全协议)握手和 CA(证书颁发机构)验证。
在 HTTPS 情况下,浏览器会先向服务器发送 Client Hello 消息,开始 TLS 握手,这是第 4 步。这个消息包含浏览器支持的 TLS 版本、加密算法等信息。
服务器会回复 Server Hello 消息,选择合适的 TLS 版本和加密算法,并发送服务器证书(由 CA 颁发)。浏览器会验证服务器证书的有效性,包括检查证书是否由受信任的 CA 颁发、证书是否过期等,这涉及到 CA 验证,也是第 4 步的一部分。
浏览器和服务器通过一系列的 TLS 消息交换,生成共享的会话密钥,完成 TLS 握手,这是第 5 步。之后,就可以通过加密的 TLS 连接发送 HTTP 请求,和普通 HTTP 请求类似,但数据是加密的。

服务器处理请求并返回响应(6 步)

服务器收到 HTTP/HTTPS 请求后,会根据请求的内容进行处理。例如,如果是请求一个网页文件,服务器会读取该文件。
服务器会构建 HTTP 响应,包括响应头(包含状态码,如 200 表示成功、404 表示未找到等,以及响应的数据格式等)和响应体(网页内容等),然后将响应发送回浏览器,这是第 6 步。

浏览器渲染网页(7 步)

浏览器收到服务器的响应后,会根据响应头中的信息来解析响应体。
如果响应体是 HTML、CSS、JavaScript 等网页相关的内容,浏览器会逐步渲染网页。首先解析 HTML 结构,构建 DOM(文档对象模型)树,然后加载和解析 CSS 样式,应用样式到 DOM 树,最后执行 JavaScript 代码,更新 DOM 树并完成网页的最终显示,这是第 7 步。
所以,从点击到网页显示大致需要 7 步,具体步骤可能会因网络环境、协议使用情况等因素而略有不同。

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
Projects
None yet
Development

No branches or pull requests

1 participant