浏览器/地址栏

浏览器地址栏（也称为​​URL 栏​​或​​搜索栏​​）是浏览器顶部用于输入和显示网页地址（URL）的输入框。它不仅是访问网站的入口，还集成了搜索、历史记录、自动补全等功能。 当我们在浏览器的地址栏，输入内容回车后，浏览器会判断内容格式。 若输入的不是有效的URL，则浏览器会自动搜索功能，打开搜索引擎展示搜索结果。 否则，浏览器将做以下工作：

1.URL解析 ​

• 浏览器解析你输入的地址，提取协议（如 https）、域名（如 www.example.com）和路径（如 /index.html）。
• 如果输入不完整（如 example），浏览器可能尝试补全协议（https://）或添加后缀（.com）。

URL请参考

2.DNS 查询（域名 → IP 地址）

• ​​检查缓存​​：浏览器先检查本地缓存（如之前访问过该域名），若无则查询操作系统缓存 → 路由器缓存 → ISP 的 DNS 缓存。
• ​​递归查询​​：若缓存未命中，浏览器通过 DNS 服务器（如 8.8.8.8）递归查询域名对应的 IP 地址（如 93.184.216.34）。
• ​​DNS 层级查询​​：若本地 DNS 服务器无记录，它会从根域名服务器（.）开始，依次查询顶级域（.com）、权威域名服务器（example.com），最终获取 IP。

3.建立 TCP 连接（三次握手）​

• 浏览器通过 IP 地址和端口（默认 443 用于 HTTPS）向服务器发起 TCP 连接。
• ​​三次握手​​：

客户端发送 SYN 包（同步序列号）。 服务器回复 SYN-ACK（确认 + 同步）。 客户端回复 ACK（确认），连接建立。

4.TLS 握手（HTTPS 加密）

• 若使用 HTTPS，客户端和服务器通过 ​​TLS 握手​​ 协商加密参数：

客户端发送支持的加密算法列表和随机数。 服务器选择算法并返回证书（含公钥）和随机数。 客户端验证证书（是否过期、是否受信任等）。 双方生成会话密钥，后续通信加密。

5. 发送HTTP GET请求

• 浏览器发送 ​​HTTP 请求报文​​。

注：浏览器地址栏触发的是GET请求，我们常见的还有POST请求，但POST请求通过网页表单、ajax等方式发起。

6.服务器接受请求，返回数据

• Web 服务器​​（如 Nginx/Apache）接收请求，可能转发给后端应用（如 PHP、Node.js）。
• ​​应用服务器​​ 执行逻辑（如查询数据库），生成动态内容。
• 服务器返回 ​​HTTP 响应​​，包含状态码（如 200 OK）、响应头（如 Content-Type: text/html）和响应体（HTML 内容）。

7.浏览器渲染页面

• ​​解析 HTML​​：构建 DOM 树（文档对象模型）。
• ​​解析 CSS​​：构建 CSSOM 树（CSS 对象模型）。
• ​​执行 JavaScript​​：可能阻塞渲染，或修改 DOM/CSSOM。
• ​​合并渲染树​​：结合 DOM 和 CSSOM，计算布局（Layout）和绘制（Paint）。
• ​​加载资源​​：如图片、字体等，可能触发重新渲染。