首页 > 其他分享 >当你在浏览其中输入一个网址回车后,发生了什么?

当你在浏览其中输入一个网址回车后,发生了什么?

时间:2024-03-30 20:11:38浏览次数:18  
标签:浏览器 请求 浏览 报文 网址 服务器 连接 回车 客户端

当我们在浏览器中输入一个网址时,等访问结束后,就能看到对应的内容。那这个过程究竟发生了什么呢?

域名解析

首先,我们需要通过域名解析来获取对应的IP地址,因为访问一个机器需要知道它的IP地址。域名解析有三种渠道:

域名解析的渠道有三种:

  1. 缓存:包括浏览器缓存、操作系统缓存、运营商缓存和公共DNS缓存。
  2. DNS服务器
  3. 域名服务器:包括权限域名服务器、顶级域名服务器和根域名服务器。

两种解析方式:

在域名解析过程中,存在着递归查询和迭代查询两种方式。

  1. 递归查询是指客户端向本地DNS服务器发出请求,本地DNS服务器负责向其他DNS服务器查询直到找到结果,并将结果返回给客户端。
  2. 迭代查询是指DNS服务器之间相互查询的过程,每个DNS服务器只负责向下一个级别的服务器查询,并将结果逐级返回,最终将结果返回给客户端。

这两种方式相辅相成,确保了域名解析的高效和准确性。

网络建立

当查询到IP地址时,就需要和服务器建立连接了。由于浏览器使用的是HTTP协议,而HTTP协议是建立在TCP协议之上的,所以需要和服务器建立TCP连接。

建立连接过程中会存在连接池和排队问题:

  1. 如果连接已经存在,则直接使用。
  2. 如果连接满了,则会进入排队状态。

TCP的连接过程是三次握手:

  1. 浏览器(客户端)发送SYN包到服务器,进入 SYN_SENT 状态。
  2. 服务器收到SYN包,发送一个SYN和ACK包,并确认Client的消息,此时服务器进入SYN_RECV状态。
  3. Client收到服务器的SYN和ACK 消息,发送一个ACK消息给服务器,进入连接状态。
  4. 服务器收到 ACK 消息后,进入连接就绪的状态。
  5. 客户端和服务器都进入了连接就绪状态,可以开始数据传输。

此时,客户端和服务器都进入了连接建立状态,可以开始数据传输。

报文传输

在HTTP通信中,客户端发送请求报文给服务器,请求报文包括请求行、请求头和请求体等部分,用来告知服务器所需资源以及请求方式等信息。

服务器收到请求后,解析请求报文,处理请求,并返回响应报文给客户端,响应报文包括响应头和响应体等部分,用来告知客户端相应内容的属性和具体内容。这样的交互过程构成了 HTTP 通信的基础。

请求报文的发送

为了方便理解,我们以抓取百度的请求为例:

  1. 从上面的报文可以看到,我们告诉服务器我们的请求方式、请求路径等信息。
  2. 服务器收到请求后,解析出我们想要的资源内容。
  3. 服务器把内容读取并响应给客户端。

响应报文接收

  1. 客户端收到的内容中包含响应头和响应内容。
  2. 响应头告诉客户端相应内容的属性(长度、类型等)。

内容渲染

当浏览器拿到内容后:

  1. 根据解析HTML代码,并将其转换为DOM树。
  2. 根据DOM树,将网页中的元素显示在浏览器中。
  3. 根据CSS代码,对网页中的元素进行美化。
  4. 根据JavaScript代码,对网页中的元素进行动态交互。

渲染网页是整个过程中耗时的步骤,如果网页内容较多,渲染时间可能会比较长。

最终,经过这一系列处理,一个完整的网页就会在浏览器中渲染出来。

服务断开

通信结束后,浏览器会根据当前的策略决定是否断开当前TCP连接。在HTTP/1.1中,默认情况下,客户端和服务器之间的TCP连接是持久连接的,即连接不会在单个HTTP请求-响应周期之后立即断开,而是保持一段时间以便后续的请求复用。持久连接可以减少建立和断开连接的开销,并提高性能。

当通信结束后,根据当前的策略,浏览器可能会选择断开当前的TCP连接,释放资源以便其他连接使用。这种断开连接的过程也需要经过四次挥手,确保数据的完整性和安全性。

四次挥手

当请求达到释放策略后,开始进入TCP的断开流程:

  1. Client 进程发送断开消息,进入FIN-WAIT-1状态。
  2. Server收到断开消息,返回ACK报文。Server开始释放连接,Server进入CLOSE-WAIT 状态。
  3. Client收到ACK回来的消息,进入FIN-WAIT-2 状态。
  4. Server 释放资源完成后,再次通知 Client 可以关闭连接,Server进入LAST-ACK状态。
  5. Client收到服务器释放完成的消息后,经过2MSL(最长报文段寿命)的时间后,当客户端撤销相应的TCB后,才进入CLOSED状态。最终关闭完成后通知Server。
  6. Server收到最后ACK消息后,直接进入CLOSED状态。

标签:浏览器,请求,浏览,报文,网址,服务器,连接,回车,客户端
From: https://www.cnblogs.com/OceanHeaven/p/18105965

相关文章

  • 使用 CRXJS、Vite、TypeScript、React、Zustand、Antd 开发 Chrome 浏览器插件——自
    一、CRXJS一、什么是CRXJS?CRXJSVitePlugin是一款使用现代Web开发技术制作Chrome扩展的工具二、CRXJS的作用CRXJS支持热加载和静态资源导入,无需手动构建配置工具CRXJSVite插件通过将Vite的精细功能与简单的配置策略相结合,简化了Chrome扩展开发者体验二......
  • URL有空格,浏览器能打开、cl_http_utility无法打开
    解决过程1、cl_http_utility打开URL失败原因是URL地址有空格,考虑到有空格直接去掉(CONDENSEl_strNO-GAPS),结果去掉之后URL打开是一推乱码失败告终!2、既然浏览器能打开看看浏览器打开的时候空格转换成什么通用字符,浏览器直接把空格转换成%20,于是在程序debug里面把空格改成%......
  • 浏览器内多个标签页之间的通信方式有哪些
    浏览器内多个标签页之间的通信方式有哪些?1.localStorage(不可跨域)在Web开发中,localStorage是一个用于在浏览器中存储键值对数据的API,可以被不同标签页或窗口之间共享。借助相关的storageevent可以使用它来实现多个标签页之间的通信。2.cookie(不可跨域)Cookie......
  • 干货网址-持续更新中
    网站类博客极客导航简书掘金知乎在线工具CX521stackoverflow博客园泡在网上的日子开源中国思否慕课网w3schoolGitHub码农网红黑联盟菜鸟工具蒲公英It之家wanandroidKotlinKotlin语言中文站FlutterFlutter中文开发者社区Eclipsejetbrains在......
  • 不同操作系统中通用解决方案,浏览器拉起app或打开本机应用软件原理,前端网页如何打开一
    不同操作系统中通用解决方案,浏览器拉起app或打开本机应用软件原理,前端网页如何打开一个PC本地应用,通过Scheme、JavaScript、第三方库分别实现前端网页打开本地应用。设想一个场景,当我们在浏览一个网页并且需要下载某个资源时,你的电脑可能经常会跳出一个提示框,询问你是否需......
  • 禁用edge、chrome浏览器自动更新
    禁用edge、chrome浏览器自动更新进入C:\ProgramFiles(x86)\Microsoft或C:\ProgramFiles(x86)\Google路径以edge为例:第一步:打开属性第二步:点击编辑第三步:修改权限......
  • 教你用Chrome 浏览器+Postman搞定接口测试
    如果把测试简单分为两类,那么就是客户端测试和服务端测试。客户端的测试包括UI测试,兼容性测试等,服务端测试包括接口测试。接口测试检查数据的交换,传递和控制管理过程,它绕过了客户端,直接对服务端进行测试。客户端测试与服务端测试的关系图:服务端非常复杂,就像下图的阿里核心链路图......
  • H5导航需要判断是不是微信内置浏览器
    goLocation(){//#ifdefH5if(Function.isWechat()){jWeixin.jWeixinOpenLocation({latitude:parseFloat(this.newData.lat),//纬度,浮点数,范围为90~-90longitude:......
  • 浏览器工作原理与实践--渲染流程(下):HTML、CSS和JavaScript,是如何变成页面的
    在上篇文章中,我们介绍了渲染流水线中的DOM生成、样式计算和布局三个阶段,那今天我们接着讲解渲染流水线后面的阶段。这里还是先简单回顾下上节前三个阶段的主要内容:在HTML页面内容被提交给渲染引擎之后,渲染引擎首先将HTML解析为浏览器可以理解的DOM;然后根据CSS样式表,计算出DOM......
  • 浏览器工作原理与实践--渲染流程(上):HTML、CSS和JavaScript,是如何变成页面的
    在上一篇文章中我们介绍了导航相关的流程,那导航被提交后又会怎么样呢?就进入了渲染阶段。这个阶段很重要,了解其相关流程能让你“看透”页面是如何工作的,有了这些知识,你可以解决一系列相关的问题,比如能熟练使用开发者工具,因为能够理解开发者工具里面大部分项目的含义,能优化页面卡......