用URL请求页面流程

从URL到页面加载:Web请求全流程解析 URL解析与DNS查询是Web请求的首要环节,通过将域名转换为IP地址建立网络连接。TCP三次握手确保可靠传输,而HTTPS通过TLS协议实现加密通信。HTTP请求与响应交互构成Web通信基础,浏览器渲染引擎则负责将HTML、CSS转换为可视化页面。现代Web性能优化技术如HTTP/2多路复用和资源预加载显著提升用户体验。理解这些网络基础原理,对于前端性能优化、后端服务调优以及全栈开发都至关重要,特别是在处理DNS查询、TCP连接等关键路径时。 阅读详情

一、打开浏览器,地址栏输入blog.youkuaiyun.com。


二、开始进行域名解析

DNS 查找过程
  1. 浏览器缓存 —— 浏览器会缓存 DNS 记录一段时间,但是操作系统并没有告诉浏览器储存 DNS 记录的时间。于是,不同浏览器会储存各自的一个固定时间( 2 分钟到 30 分钟不等)。
  2. 系统缓存 – 如果在浏览器缓存里没有找到需要的记录,浏览器会做一个系统调用( Windows 里是 gethostbyname ),这样便可获得并查询系统缓存中的记录。
  3. 路由器缓存 – 接着,前面的查询请求发向路由器。路由器一般会有自己的 DNS 缓存。
  4. ISP DNS缓存 – 接下来要 check 的就是 ISP 缓存 DNS 的服务器。ISP (Internet Service Provider)就是互联网服务提供商,在这一般都能找到相应的缓存记录。
  5. 递归搜索 – 你的 ISP 的 DNS 服务器从根域名服务器开始进行递归搜索,从 .com 顶级域名服务器到 example 的域名服务器。一般 DNS 服务器的缓存中会有 .com 域名服务器中的域名,所以到顶级服务器的匹配过程不是那么必要了。
DNS 进行域名解析的过程
  1. 客户端发出 DNS 请求翻译 IP 地址或主机名;
  2. DNS 服务器在收到客户端的请求后,检查 DNS 服务器的缓存,若查到请求的地址或名字,即向客户端发出应答信息;
  3. 若没有查到,则在数据库中查找,若查到请求的地址或名字,即向客户端发出应答信息;
  4. 若没有查到,则将请求发给根 DNS 服务器,并依序从根域查找顶级域,由顶级查找二级域,二级域查找三级,直至找到要解析的地址或名字。然后,向客户端所在网络的 DNS 服务器发出应答信息,DNS 服务器收到应答后,先在缓存中存储,然后,将解析结果发给客户端。
  5. 若没有找到,则返回错误信息。

三、三次握手建立TCP连接

  1. 第一次握手:建立连接时,客户端发送syn同步序列编号(syn=j)到服务器,并进入SYN_SENT状态,等待服务器确认;SYN:(Synchronize Sequence Numbers)。
  2. 第二次握手:服务器收到syn包,必须确认客户的SYN(ack=j+1),同时自己也发送一个SYN包(syn=k),即SYN+ACK包,此时服务器进入SYN_RECV状态;

  3. 第三次握手:客户端收到服务器的SYN+ACK包,向服务器发送确认包ACK(ack=k+1),此包发送完毕,客户端和服务器进入ESTABLISHED(TCP连接成功)状态,完成三次握手。

这里写图片描述


四、HTTP请求

完成三次握手,客户端与服务器开始传送数据:

  1. 服务器端接受到请求,根据路径参数,经过后端的一些处理之后,把处理后的一个结果数据返回给浏览器,如果是一个完整的网页,就是把完整的html页面代码返回给浏览器。
  2. 浏览器拿到html页面代码,解析和渲染页面,里面的 js、css图片资源都需要经过上面的步骤。
  3. 浏览器拿到资源对页面进行渲染,最终把一个完整的页面呈现给用户。

五、四次挥手断开TCP连接

由于 TCP 连接是全双工的,因此每个方向都必须单独进行关闭。原则是当一方完成它的数据发送任务后,就能发送一个 FIN 来终止这个方向的连接。收到一个 FIN 只意味着这一方向上没有数据流动。

  1. 第一次挥手:TCP 客户端发送一个 FIN,用来关闭客户端到服务器的数据传送。意思是说”我Client端没有数据要发给你了,但是如果你还有数据没有发送完成,可以继续发送数据。“
  2. 第二次挥手:服务器收到这个 FIN,它发回一个 ACK,确认序号为收到的序号加 1 。这是在告诉Client端:”你的请求我收到了,但是我还有数据要发送,请继续你等我的消息。”
  3. 第三次挥手:服务器发送一个 FIN 给客户端。
  4. 第四次挥手:客户端发回 ACK 报文确认,并将确认序号设置为收到序号加 1 。服务器端收到ACK后就可以断开连接了;客户端等待一段时间没有回复也就确认了服务器端已经关闭连接了,它也释放连接。
Linux·从 URL 输入到页面展现到底发生什么? 从 URL 输入到页面展现到底发生什么? 阅读详情

相关推荐

从输入URL到页面渲染:一次完整的浏览器请求流程揭秘

安全属性实现方式机密性对称加密(AES)完整性HMAC 或 AEAD(如 GCM)身份认证数字证书 + CA 信任链不可否认性数字签名机制前向保密ECDHE 密钥交换性能提示:TLS 1.3 大幅简化握手流程,多数情况下只需一次往返(1-RTT),甚至支持 0-RTT 快速重连。

weixin_35755434的博客 1736

6、SpringMVC-常用注解-请求参数

概要 处理方法参数绑定常用的注解,我们根据他们处理的Request的不同内容部分分为三大类 处理request header部分的注解: @RequestHeader, @CookieValue; 处理request body部分的注解:@RequestParam, @RequestBody; 处理attribute类型是注解: @SessionAttributes, @ModelAttrib...

qq_14943403的博客 341

西门子CPU与汇川伺服通信与控制

第三方驱动器的配置内容和西门子的配置内容基本一致,基本上会一种即可知道其他品牌的配置默认报文,需要激活硬限位才能收到限位信号默认报文,原点信号不能实时输出到PLC;自定义报文,需要伺服端设置DIN点位。

大小曲奇的博客 1万+

springboot url请求的多种方式

第一种 请求方式 get 请求url http://ip:port/类路径/方法路径 例子 http://localhost:8080/helloWorld/s...

chukuaiyao2414的博客 516

【一起学UniGUI】--UniGUI的部署选项(5)

uniGUI支持Windows平台下所有主要部署选项。 1.Standalone Server (独立服务器) 最简单的部署方法是独立服务器。在这种模式下,应用程序服务器像桌面应用程序一样直接运行。它也是用于调试应用程序的模式。运行应用程序可执行文件后(它是一个EXE文件),它将最小化到托盘图标,并运行到用户手动终止为止。见下图: 一个独立的应用程序可以...

5776

手把手教你用VSCode+MCUXpresso搭建i.MX RT1062开发环境(附RT-Thread Nano移植)

本文详细介绍了如何使用VSCode和MCUXpresso工具链搭建i.MX RT1062开发环境,包括工具链安装、工程配置、调试技巧以及RT-Thread Nano实时操作系统的移植方法。通过实战步骤和优化建议,帮助开发者快速掌握这款高性能Cortex-M7 MCU的开发流程,提升嵌入式开发效率。

weixin_27014595的博客 392

使用springboot接收url中?后面的参数

请求的链接如下: http://localhost:8080/getar/?page=1&limit=10 那么在后端可以通过如下方式接收参数 @GetMapping("/getar") @ResponseBody public Table getArInfo(int page, int limit) { System.out.println(page); System.out.println(limit); retur

Flying_6的博客 1186

《八》:玩家位置同步(玩家防碰撞)

在VR大空间体验中,由于玩家佩戴头显设备无法直接观察彼此位置,容易发生碰撞。因此,需要将玩家的实时位置信息绘制在虚拟空间中,实现位置可视化。通过获取头显的位置和旋转角度等数据,可以推算出玩家的移动状态和位置。使用可序列化的玩家结构体,通过UDP将玩家数据发送到服务器,服务器接收并反序列化数据后,同步所有玩家的最新信息至各客户端。客户端根据接收到的数据渲染虚拟人物模型,实现动态位置更新。这一过程涉及数据序列化、反序列化、网络通信和实时渲染等技术,确保玩家在虚拟空间中的位置同步和可视化。

unitygroup的博客 413

Request URL: http://localhost:8080/api/api/user

Request URL: http://localhost:8080/api/api/user 在进行前后端交互的时候,进行跨域请求,出现了404 not found的结果,并且出现了两个api。 配置文件和src不是同级,试了下把vue.config.js和src同级,之后报了500. 之前这里是9999,代理地址随后被我更改成了9876 接着又404了。 还试了在contrller里头加crossorigin注解 还是404 ...

chanyeolchichi的博客 7198

Maestro 薛定谔软件简单分子对接案例

#参考:Maestro 薛定谔软件使用:Maestro 薛定谔对接:sid=287811。

weixin_42357472的博客 1万+

【RKNN】RKNN(Rockchip Neural Network)​​ 的详解

RKNN 为 Rockchip 硬件提供了高效的 AI 推理解决方案,适合需要低功耗、实时响应的边缘场景

浩瀚之水的专栏 1684

访问一个url的全过程

访问一个url的全过程前言过程DNS解析具体过程建立TCP连接TCP报文格式三次握手浏览器发送Http请求Http报文格式服务器返回Http响应浏览器根据响应进行解析渲染,呈现给用户浏览器关闭TCP连接Connection: keep-alive四次挥手关闭TCP连接 前言 当我们在浏览器上键入www.baidu.com,并按下回车时,发生了哪些事? 过程 大致有这几个流程 1:DNS解析,得到IP地址 2:浏览器根据IP地址,访问服务器,建立TCP连接 3:建立完TCP连接后,浏览器向服务器发送http请

qq_37376024的博客 4184

高精度导航 | RTK:2025年高精度导航算法综述,包括:原理,数据,公式,完整代码,开源代码链接

中国科学院国家授时中心的最新研究表明,PPP-AR/PPP-RTK增强算法使时间传递链路的稳定性提升超过30%,模糊度固定成功率高达93.57%,首次固定时间缩短至20分钟内。当这一愿景实现,人类社会的生产效率和资源利用率将迎来革命性提升,高精度定位将成为像电力、互联网一样的基础服务,深刻重塑我们的生活方式和文明形态。PPP-RTK作为GNSS定位领域的最前沿技术,成功融合了精密单点定位(PPP)和实时动态定位(RTK)的双重优势。,实现在无GNSS信号环境下(如隧道、地下停车场)的连续厘米级定位。

尘世冰封的专栏 1606

从URL输入到页面渲染:Web请求全流程解析

DNS解析和TCP连接是Web请求的基础环节。DNS将域名转换为IP地址,涉及浏览器缓存、操作系统缓存和递归查询等多级查找机制。TCP通过三次握手建立可靠连接,确保数据传输的稳定性。这些底层网络协议支撑着现代Web应用的高效运行,直接影响页面加载速度。在性能优化中,减少DNS查询、复用TCP连接是关键策略。本文以电商网站为例,详细解析从URL输入到页面渲染的完整链路,包括HTTP请求构建、服务器响应处理和浏览器渲染机制,帮助开发者深入理解Web工作原理。

weixin_33858485的博客 569

项目经理必看:如何建立高效的相关方沟通机制?

你是否遇到过这样的场景?客户突然说“这不是我要的”,开发团队抱怨“需求总变”,高层追问“进度滞后为什么不早说”?这些问题的根源往往是——相关方沟通机制失效。本文聚焦“如何建立高效沟通机制”,覆盖从识别相关方到持续优化的全流程,适用于IT、产品、工程等各类项目。本文将按“理解问题→拆解核心概念→掌握工具方法→实战落地→未来趋势”的逻辑展开,重点讲解“相关方分析矩阵”“沟通计划表”等实用工具,并用“组织生日派对”的案例贯穿全文,让抽象概念变得可感知。相关方识别:用“权力/利益矩阵”找对人(像派对邀请关键客人)

项目管理的博客 1295

蓝牙模块HM-10手册

蓝牙模块HM-10手册,该手册对蓝牙模块HM-10进行了详细的介绍和使用方法以及一些AT指令。

从 URL 输入到页面呈现:Web 请求全链路处理流程

摘要:一个完整的Web请求处理流程包括:用户浏览器解析URL并进行DNS查询,建立TCP连接和HTTPS握手;请求通过Nginx负载均衡转发至后端服务器;Tomcat接收请求并交由SpringMVC处理,经过业务逻辑、数据访问层后生成响应;响应经原路返回至浏览器解析渲染。整个过程涉及网络协议、负载均衡、应用框架和数据库交互,体现了现代Web应用的分层架构设计。

zwx_zwx2024的博客 1106

霍尼韦尔SoftMaster使用说明

霍尼韦尔SoftMaster使用说明

HTTP请求全流程:从浏览器输入URL到页面渲染

本文系统解析了从浏览器输入URL到页面渲染的完整HTTP请求流程。主要包括:1)浏览器解析URL并进行DNS域名解析;2)建立TCP连接(HTTPS包含TLS握手);3)构建HTTP请求报文并发送;4)服务器通过负载均衡、反向代理等处理请求;5)生成HTTP响应并返回结果;6)浏览器解析HTML/CSS并渲染页面。整个流程涉及网络层、协议层、架构层等多环节协作,理解该机制对Web性能优化和故障排查具有重要意义。

qq_73192970的博客 864

visio安装包

Microsoft Office Visio 是一款专业的制图软件。利用经过更新的形状、协作工具和数据链接图表,创建专业级图表以简化复杂的信息。

从URL输入到页面加载:Web请求全流程解析

Web请求是互联网通信的基础,涉及DNS解析、TCP连接、HTTP协议等多个核心技术环节。DNS查询将域名转换为IP地址,通过TCP三次握手建立可靠连接,HTTPS则在此基础上加入TLS加密层确保安全传输。HTTP协议作为应用层标准,定义了请求-响应模型,支持各种内容类型和状态管理。浏览器渲染引擎随后解析HTML构建DOM树,结合CSS生成渲染树,最终通过布局和绘制呈现页面。这一流程直接影响Web性能指标如LCP和FID,优化手段包括DNS预取、HTTP/2多路复用、资源预加载等。理解完整的请求生命周期,有

weixin_31236101的博客 313

发送一个url请求到页面渲染完成经历的流程

访问顺序 1.在浏览器输入网址(url) 2.域名解析 3.TCP建立连接 4.浏览器向服务器发送http请求 5.服务器接收请求 6.页面渲染 一:在浏览器输入网址(url) 在浏览器地址栏输入网址 二:域名解析 DNS解析:域名到IP地址的转换过程。域名的解析工作由DNS服务器完成。解析后可以获取域名相应的IP地址 DNS解析过程: 1. 先去本地hosts文件中读取对应ip映射,如果找到跳...

tiger-guo 1103

四、导航流程:从输入URL到页面展示,这中间发生了什么

目录 从输入 URL 到页面展示 1. 用户输入 2. URL 请求过程 3. 准备渲染进程 4. 提交文档 5. 渲染阶段 总结 从输入 URL 到页面展示完整流程示意图 先来快速回顾下浏览器进程、渲染进程和网络进程的主要职责: 浏览器进程主要负责用户交互、子进程管理和文件储存等功能。 网络进程是面向渲染进程和浏览器进程等提供网络下载功能。 渲染进程的主要职责是把从网络下载的 HTML、JavaScript、CSS、图片等资源解析为可以显示和交互的页面。因为渲染进程所有的内容都.

知之为知之,不知为不知 652

【Java web】页面请求的工作流程【从输入URL到页面展示到底发生了什么】

https://mp.weixin.qq.com/s?__biz=MzAxNDMwMTMwMw==&mid=2247488981&idx=1&sn=cddfdfe93d7d90d463b3f81cae56ecd2&chksm=9b9434cdace3bddbcc19fe6740f0e6a1ac33b5f29f7bdb9f1f7861b761065fff85c4778...

ZHAOJING1234567的博客 381

【转】导航流程:从输入URL到页面展示,这中间发生了什么?

从输入URL到页面展示,这中间发生了什么?

LZUGIS 911

在浏览器输入URL回车之后?

流程 URL 解析 DNS 查询 TCP 连接 处理请求 接受响应 渲染页面

weixin_39145343的博客 131

生成的url无法显示_从输入URL到页面展示,这中间发生了什么?

这是一道经典的面试题,但是很多人的回答却不尽完美,但是这道题却能比较全面地考察应聘者知识的掌握程度,其中涉及到了网络、操作系统、Web 等一系列的知识。我曾经也遇到过这个问题,于是我花费了一些时间对这个问题进行了整理,以下是我的整理结果。从URL到页面展示流程1.用户输入,按enter键如果用户输入的是搜索内容,地址栏会使用浏览器默认的搜索引擎,来合成新的带搜索关键字的 URL。如果用户输入的是u...

weixin_35305499的博客 1084

从输入URL到浏览器显示页面的流程

转载自 : 从输入URL到浏览器显示页面的流程 从输入URL到浏览器显示页面的流程 当在浏览器中输入域名,敲下回车后,不一会儿浏览器就会显示我们想要的界面。本文将简单介绍这其中经历了什么过程。 注意:以下分析基于HTTP请求,并且Web容器使用Tomcat,后端框架使用SSM 一、URL解析 1、地址解析 浏览器会根据你的输入来判断该输入是一条合法的URL,还是需要被搜索的关键词。并且根据你输入的内容进行自动完成、字符编码等操作。 2、其他操作 目前大部分浏览器都会强制客户端使用HTTPS协议以保证信.

Guizy 1811
上一篇: 下单系统水平可扩展框架
下一篇: 带权重的随机Java实现
奋起直追CDS
博客等级 码龄11年 57粉丝 94原创
评论
成就一亿技术人!
拼手气红包6.0元
还能输入1000个字符
 
 条评论被折叠 查看
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

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

抵扣说明:

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

余额充值