当我的浏览器输入域名后,发生了什么?(转)

本文详细阐述了当在浏览器中输入网址后,从域名解析到数据转发的整个网页加载过程。包括DNS服务器的角色、TCP连接的建立、HTTP请求的构造与响应,以及CDN和服务器内部数据处理机制。

文章转自 https://www.cnblogs.com/shy0322/p/9276883.html

我们以百度为例子,当我在浏览器的中输入网址www.baidu.com时,发生了什么?

     

1.域名解析

  要知道,数据传输时所识别的数据链路层封装的帧,并不是通过字符串“www.baidu.com”传输的,而是通过对放的MAC地址找到对方的(硬件地址),那么要想获得MAC地址,自然也是通过IP地址并通过ARP协议转换而来的。

  因为应用层只认识IP地址,所以当务之急,要想获取数据,必须先了解“www.baidu.com”域名所对应的IP地址。

  想到了什么?DNS服务器——域名解析服务器

  但是我们要知道,我们的网络环境是错综复杂的,所以能自己自立根深解决的问题,尽量不要去麻烦别人,就好比你不确定高速路上堵不堵,你可以在家楼下买到香烟,何必大老远上高速去上海买呢?

  

 

 

  a)浏览器会从主机的Hosts文件中查看是否有百度域名和IP地址的映射。

   Hosts文件是一个用于存储计算机网络中节点信息的文件,它可以将主机名映射到相应的IP地址,实现DNS的功能,它可以由计算机的用户进行控制。

   (PS:所以如果我们修改它,将www.baidu.com的对应IP改为127.0.0.1,看看会发生什么?)

 

  b)如果Hosts文件没有,浏览器会查看自己的缓存。(由上面 PS 中的结果可以得出结论顺序为先 a) 再 b) 还是先 b) 再 a))。

 

  c)当上面两个方法都行不通时,只能去请求DNS服务器来获取IP地址,这个过程用图片更好理解

  我们先来看一下分布式的域名系统DNS:

  

  我们以m.xyz.com 向 a.abc.com发送邮件为例,我们m.xyz.com询问对方域名解析的方式分别是迭代查询和递归查询,如图所示:

  


    

 

2.发起连接,构造请求。

  获取了对方的IP地址后,我们自然要发送相对的HTTP报文(当然因为百度是https://www.baidu.com/,所以在发送HTTP请求报文前要先发送一个HTTPS报文建立一个安全信道,并且确定网站的真实性。)

  a)建立TCP连接,牢记三次握手的过程。

  

  b)确认连接后发送一个HTTP请求报文。

   在这里要清楚网络栈模型封装HTTP数据包的过程,先是写入HTTP报文的信息——首行、头部、空行、内容。再是在传输层打包,加上TCP首部,再来到IP层加上IP头部,通过ARP协议知道对方的MAC地址,到数据链路层打包封装成帧,通过路由转发,抵达目的MAC地址,再自下而上拆包,知道抵达对方服务器。之后对方服务器写一个响应报文再用同样的方式传回。

  HTTP请求报文的格式:

  

  需要注意的是,还有两个很常见的报文方法是 CONNECT 和 GET 。

  CONNECT表示要求用隧道协议连接代理,连接https协议下的域名时经常可以抓到这个类型的包。

  GET表示获取资源,与POST作用大致相同,最大的不同就是POST有body,而GET没有。

 

3.数据转发

  我们在2中有提及过细粒度上的路由转发。那么在粗粒度上发生了什么?

  a)请求抵达运营商维护的CDN服务器,看看是否有该请求对应响应的静态页面。

    CDN的一大作用就是贮存一些在它所管理区域会频发用到的响应静态页面,这在很大程度上就很好的减轻了网络压力,用户不用直接去询问网站的总部服务器,可以更快得到响应,增加了用户体验的幸福感,还减轻了网络拥塞,两全其美。

  b)如果CDN没有,则先询问百度入口服务器,如果入口服务器有对应请求响应的静态页面,那么可以作为一个反向代理回复请求报文。

    入口服务器的作用也是为了提高用户体验的幸福感,入口服务器也会贮存一些常用的静态页面,这也不用再深入其他服务器取数据了。

  c)如果入口服务器也没有,则要深入去相关的服务器取得数据。

    就比如我要看图片,还有我登录了账号的信息,就会从图片服务器,用户管理服务器去取响应数据。

  详情见图:

  

 

转载于:https://www.cnblogs.com/shuaiandjun/p/10262579.html

<think> 嗯,用户想了解输入域名回车后的完整过程。这个问题看似常见,但涉及计算机网络多个核心层面,需要系统性地梳理。 用户提供的四个引用材料很有价值,特别是引用[3]的八个步骤框架非常清晰,但需要补充技术细节。引用[1]提到的DNS解析比喻和引用[4]的路由缓存机制也值得整合。 考虑从物理操作到最终渲染的完整链路展开: 首先必须强调DNS解析的细节,包括浏览器缓存→hosts文件→本地DNS服务器的查询顺序,这点引用[4]的路由缓存描述很准确。TCP三次握手部分要解释SYN/ACK包交换过程,但避免术语堆砌。 注意到引用[2]提到HTTP请求头细节容易被忽略,比如User-Agent和Accept字段,这部分对理解浏览器行为很重要。页面渲染环节需要补充关键路径渲染(Critical Rendering Path)的概念,解释HTML/CSS/JS如何变成像素。 安全机制是用户没问但必须涵盖的:TLS握手在HTTPS场景的触发时机,以及证书验证过程。引用材料中都没提到Service Worker等现代特性,考虑在异步请求环节补充。 最后要强调流程的非线性——浏览器预解析、连接复用等优化手段会使某些步骤并行。用户可能是开发者或面试准备者,考虑在回答末尾添加三个进阶问题:关于HTTP/3的QUIC协议、前端性能优化切入点、网络安全防护层,形成知识闭环。 </think> 在浏览器输入域名(如 `www.example.com`)并按下回车后,整个流程涉及网络协议栈、操作系统和浏览器引擎的协同工作。以下是详细步骤: --- ### 🌐 **1. URL解析** - 浏览器解析输入内容: - 若输入非完整URL(如 `example`),浏览器尝试补全协议(`https://`)和后缀(`.com`)。 - 特殊输入(如直接输入IP)跳过DNS解析。 - 检查**HSTS列表**(强制HTTPS的域名)[^4]。 --- ### 🔍 **2. DNS解析(获取服务器IP)** 1. **浏览器缓存**:检查本地DNS缓存(如 Chrome 的 `net-internals`)。 2. **系统缓存**:查询操作系统 hosts 文件(如 Windows 的 `C:\Windows\System32\drivers\etc\hosts`)。 3. **路由器缓存**:向本地路由器发送 DNS 查询。 4. **ISP DNS服务器**: - 递归查询根域名服务器 → 顶级域(`.com`)服务器 → 权威域名服务器。 - 最终返回目标域名的 IP 地址(如 `93.184.216.34`)[^1][^3][^4]。 > **比喻**:DNS 解析如同查找电话号码簿,将域名“翻译”为服务器 IP。 --- ### 🤝 **3. 建立TCP连接(三次握手)** - **步骤**: 1. 客户端发送 `SYN` 包(序列号 `x`)。 2. 服务器回复 `SYN-ACK` 包(序列号 `y`,确认号 `x+1`)。 3. 客户端发送 `ACK` 包(确认号 `y+1`)。 - 若为 HTTPS 请求,后续启动 **TLS 握手**(交换密钥、验证证书)[^2][^3]。 --- ### 📤 **4. 发送HTTP请求** 浏览器构造 HTTP 请求报文: ```http GET /index.html HTTP/1.1 Host: www.example.com User-Agent: Mozilla/5.0 Accept: text/html,application/xhtml+xml Cookie: session_id=abc123 ``` - 包含请求行、请求头、空行及可能的请求体(如 POST 数据)[^3]。 --- ### ️ **5. 服务器处理请求** - Web 服务器(如 Nginx/Apache): 1. 解析请求路径和参数。 2. 执行后端逻辑(如 PHP/Python 脚本)。 3. 查询数据库或缓存。 4. 生成 HTTP 响应(状态码 + HTML/CSS/JS 等资源)[^3][^4]。 --- ### 📥 **6. 接收响应** 服务器返回响应报文: ```http HTTP/1.1 200 OK Content-Type: text/html; charset=UTF-8 Content-Length: 1234 <!DOCTYPE html><html>...</html> ``` - 状态码(如 `200` 成功、`404` 未找到)决定后续行为[^2]。 --- ### **7. 浏览器渲染页面** 1. **解析 HTML**:构建 DOM 树。 2. **解析 CSS**:生成 CSSOM 树。 3. **合并渲染树**(DOM + CSSOM)。 4. **布局**(Layout):计算元素位置和尺寸。 5. **绘制**(Paint):将像素输出到屏幕。 6. **执行 JavaScript**: - 若遇到 `<script>` 标签,暂停解析直至脚本执行完成(除非标记 `async/defer`)。 - 触发事件(如 `DOMContentLoaded`)[^1][^3]。 --- ### ♻️ **8. 异步请求与连接关闭** - **异步请求**:页面加载后,JavaScript 可能发起 Ajax/Fetch 请求更新内容。 - **关闭 TCP连接**(四次挥手): 1. 客户端发送 `FIN`。 2. 服务器回复 `ACK`。 3. 服务器发送 `FIN`。 4. 客户端回复 `ACK`(连接终止)[^3][^4]。 --- ### **关键优化机制** - **连接复用**:HTTP/1.1 默认长连接(`Connection: keep-alive`),减少握手开销。 - **管线化(Pipelining)**:并行发送多个请求(HTTP/2 进一步优化)。 - **预解析**:浏览器在解析 HTML 时提前发起 DNS 查询或 TCP 连接。 --- ### 📚 **相关问题** 1. **DNS 解析为何需要递归与迭代结合?** > 本地 DNS 服务器迭代查询根域和顶级域,客户端只需等待最终结果(递归)[^1]。 2. **HTTPS 的 TLS 握手具体如何加密数据?** > 通过非对称加密交换会话密钥,后续通信使用对称加密(如 AES)保证效率[^4]。 3. **浏览器渲染遇到 JavaScript 阻塞如何处理?** > 使用 `async`(异步加载)或 `defer`(延迟执行)避免阻塞 DOM/CSSOM 构建[^3]。 --- > 流程中各环节高度依赖缓存(DNS/TCP/HTTP)和协议优化(如 HTTP/2 多路复用),实际过程可能因浏览器策略(预加载、预渲染)而并行提速 [^1][^2][^3][^4]。
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值