详细分析:当我们用浏览器访问一个网站到页面展示,背后经历了什么?

本文涉及的产品
公共DNS(含HTTPDNS解析),每月1000万次HTTP解析
云解析 DNS,旗舰版 1个月
全局流量管理 GTM,标准版 1个月
简介: 详细分析:当我们用浏览器访问一个网站到页面展示,背后经历了什么?

当我们用浏览器访问一个网站到页面显示出来,身为用户我们只要用鼠标点点点就实现了页面展示,但是实际过程是有亿点点复杂。

大致过程为:

  1. 域名解析获取域名对应的IP地址
  2. 获得服务器的IP地址后与其建立TCP连接
  3. 客户机发送请求和接收资源

那么具体是怎样的过程的呢?


一、前提概要


1、网络分层模型image.png


2、什么是IP地址?

  • IP地址是IP协议提供的一种统一的地址格式,它为互联网上的每一个网络和每一台主机分配一个逻辑地址,以此来屏蔽物理地址的差异。
  • IP地址是32比特的全球唯一标识符
  • IP地址在整个因特网范围内是唯一的。

3、什么是域名?

image.png

  • 因特网采用层次树状结构的命名方法,任何一个连接到因特网的主机或路由器,都有一个唯一的层次结构名称, 即域名
  • 是名字空间中一个可被管理的划分。域还可以划分为子域,而子域还可以继续划分为子域的子域,这样就形成了顶级域、二 级域、三级域等。
  • 每个域名都由标号序列组成,而各标号之间用点(“.") 隔开。

4、什么是DNS

  • 域名系统:因特网使用的命名系统,用来把便于人们记忆的具有特定含义的主机名(如 www.baidu.com)转换为便于机器处理的IP地址。
  • DNS使用了大量的域名服务器,他们以层次方式组织
  1. 根域名服务器
  2. 顶级域名服务器
  3. 授权域名服务器(权限域名服务器)
  4. 本地域名服务器

二、漫漫取经之路就在脚下

1、域名解析

访问www.baidu.com时,需要将域名映射为对应的IP地址。即域名解析的过程。

image.png

20210614210757723.png


2、建立TCP连接(三次握手)


  1. 服务器上会有一个进程一直在不断地监听TCP 80端口
  2. 客户机在获取到对应的 IP地址后,客户机向服务器发送一个连接请求报文
  3. 服务器监听到连接请求报文之后,向客户机返回一个确认报文,并为此次TCP连接分配缓存和变量
  4. 当客户机收到确认报文段后,再向服务器发出一个确认报文,并为此次连接分配缓存和变量
  5. 服务器再收到确认报文之后,TCP连接就建立成功了

3、获取资源

设HTTP协议使用持久连接5:

  1. TCP连接建立成功之后,客户机向服务器通过TCP连接发送携带请求资源信息的HTTP请求报文
  2. 服务器收到HTTP请求报文之后,通过HTTP响应报文将客户机请求的资源发送给客户机
  3. 如需多个资源,重复以上操作即可
注:

实际上,客户机向服务器在建立TCP的第三次握手时发送的确认报文可以携带上HTTP请求报文


4、浏览器解释

客户机在接收到服务器返回的资源后,对其进行解释,用超文本标记语言(html)将其显示在屏幕上



目录
相关文章
|
2月前
|
Web App开发 编解码 vr&ar
使用Web浏览器访问UE应用的最佳实践
在3D/XR应用开发中,尤其是基于UE(虚幻引擎)开发的高精度场景,传统终端因硬件局限难以流畅运行高帧率、复杂效果的三维应用。实时云渲染技术,将渲染任务转移至云端服务器,降低终端硬件要求,确保用户获得流畅体验。具备弹性扩展、优化传输协议、跨平台支持和安全性等优势,适用于多种终端和场景,特别集成像素流送技术,帮助UE开发者实现低代码上云操作,简化部署流程,保留UE引擎的强大开发能力,确保画面精美且终端轻量化。
124 17
使用Web浏览器访问UE应用的最佳实践
|
4月前
|
监控 供应链 前端开发
浏览器拨测:将网站护航的阵地再前推一米
近年来,针对网站的攻击形式愈发多样,手段也变得更加隐蔽,使用浏览器拨测来监控服务的整个生命周期有助于及时发现攻击,保护核心业务链路不受损。阿里云监控浏览器拨测使用真实的浏览器进行拨测,通过提供丰富的断言能力和脚本录制能力护航服务的全生命周期和核心业务链路,助力开发者更好地监控服务的可用性,消除潜在风险。
221 24
浏览器拨测:将网站护航的阵地再前推一米
|
4月前
|
Web App开发 JavaScript 前端开发
使用 Chrome 浏览器的内存分析工具来检测 JavaScript 中的内存泄漏
【10月更文挑战第25天】利用 Chrome 浏览器的内存分析工具,可以较为准确地检测 JavaScript 中的内存泄漏问题,并帮助我们找出潜在的泄漏点,以便采取相应的解决措施。
593 9
|
4月前
|
缓存 监控 测试技术
如何利用浏览器的缓存来优化网站性能?
【10月更文挑战第23天】通过以上多种方法合理利用浏览器缓存,可以显著提高网站的性能,减少网络请求,加快资源加载速度,提升用户的访问体验。同时,要根据网站的具体情况和资源的特点,不断优化和调整缓存策略,以适应不断变化的业务需求和用户访问模式。
165 7
|
4月前
|
存储 缓存 网络协议
计算机网络常见面试题(二):浏览器中输入URL返回页面过程、HTTP协议特点,GET、POST的区别,Cookie与Session
计算机网络常见面试题(二):浏览器中输入URL返回页面过程、HTTP协议特点、状态码、报文格式,GET、POST的区别,DNS的解析过程、数字证书、Cookie与Session,对称加密和非对称加密
|
4月前
|
Web App开发 监控 前端开发
如何确保使用 DPR 进行响应式设计的网站在各种浏览器上都能正常显示?
【10月更文挑战第24天】通过以上这些措施,可以最大程度地确保使用 DPR 进行响应式设计的网站在各种浏览器上都能正常显示。同时,不断的优化和改进也是保持网站兼容性的关键。
|
4月前
|
域名解析 缓存 网络协议
浏览器中输入URL返回页面过程(超级详细)、DNS域名解析服务,TCP三次握手、四次挥手
浏览器中输入URL返回页面过程(超级详细)、DNS域名解析服务,TCP三次握手、四次挥手
|
4月前
|
域名解析 网络协议 前端开发
浏览器输入域名网址访问后的过程详解
1、以91处理网为例,客户端浏览器通过DNS解析到www.91chuli.com,IP地址是202.108.22.5,通过这个IP地址找到客户端到服务器的路径。客户端浏览器发起一个HTTP会话到202.108.22.5,然后通过TCP进行封装数据包,输入到网络层。
131 2
|
4月前
|
Web App开发 API Windows
取接口访问者信息[IP,浏览器,操作系统]免费API接口教程
此API用于获取访问者的IP地址、浏览器和操作系统信息,支持70多种浏览器和操作系统。通过POST或GET请求至`https://cn.apihz.cn/api/ip/getapi.php`,需提供用户ID和KEY。返回结果包括状态码、消息、IP、浏览器和操作系统信息。示例:{"code":200,"ip":"175.154.88.178","browser":"Chrome","os":"Windows 10"}。详情见官网文档。
|
5月前
|
Web App开发 前端开发 JavaScript
为什么浏览器兼容性在开发网站时很重要?
浏览器兼容性在网站开发中确实非常重要。

热门文章

最新文章