从地址栏输入url,回车到页面展示中间，发生了什么事情？

wanning
336 阅读23分钟
主要流程

1.解析URL

2.DNS解析

3.浏览器与网站建立TCP连接（三次握手）

4.客户端发起http请求

5.服务器处理请求

6.服务器响应请求

7.浏览器解析html

8.断开TCP连接（四次挥手）

1.解析URL

1.1 url是什么？

Internet上的每一个网页都具有一个唯一的名称标识，通常称之为URL（Uniform Resource Locator, 统一资源定位器）。简单地说，URL就是web地址，俗称“网址”。

1.2 url主要由哪几部分组成

URL由三部分组成：资源类型、存放资源的主机域名、资源文件名。也可认为由四部分组成：协议、主机、端口、路径。

URL的一般语法格式为：

protocol :// hostname[:port] / path / [;parameters][?query]#fragment
  • protocol（协议）： 指定使用的传输协议，最常用的是HTTP协议，它是目前WWW中应用最广的协议。 下面列出protocol属性常见的名称：
http  通过 HTTP 访问该资源。 格式 HTTP://
https 通过安全的 HTTPS 访问该资源。 格式 HTTPS://
ftp   通过 FTP访问资源。格式 FTP://

一般来说，https开头的URL要比http开头的更安全，因为这样的URL传输信息采用了加密技术。

  • hostname（主机名） 是指存放资源的服务器的域名系统(DNS) 主机名或 IP 地址。
  • port(端口) http协议默认端口是80端口，如果不写默认就是80端口
  • path(路径) 网络资源在服务器中的指定路径
  • parameter(参数) 如果要向服务器传入参数，在这部分输入
  • query(查询字符串) 可选，用于给动态网页（如使用CGI、ISAPI、PHP/JSP/ASP/ASP等技术制作的网页）传递参数，可有多个参数，用“&”符号隔开，每个参数的名和值用“=”符号隔开。
  • fragment 片段 信息片断，字符串，用于指定网络资源中的片断。例如一个网页中有多个名词解释，可使用fragment直接定位到某一名词解释。

举个例子：

url：www.aspxfans.com:8080/news/index.…

1.协议部分：该URL的协议部分为“http：”，这代表网页使用的是HTTP协议。在”HTTP”后面的“//”为分隔符

2.域名部分：该URL的域名部分为“www.aspxfans.com”。 一个URL中，该部分也可以直接使用IP地址

3.端口部分：跟在域名后面的是端口，域名和端口之间使用“:”作为分隔符。

4.虚拟目录部分：从域名后的第一个“/”开始到最后一个“/”为止，是虚拟目录部分。本例中的虚拟目录是“/news/”

5.文件名部分：从域名后的最后一个“/”开始到“？”为止，是文件名部分，如果没有“?”,则是从域名后的最后一个“/”开始到“#”为止，是文件部分，如果没有“？”和“#”，那么从域名后的最后一个“/”开始到结束，都是文件名部分。本例中的文件名是“index.asp”。文件名部分也不是一个URL必须的部分，如果省略该部分，则使用默认的文件名

7.参数部分：从“？”开始到“#”为止之间的部分为参数部分，又称搜索部分、查询部分。本例中的参数部分为“boardID=5&ID=24618&page=1”。参数可以允许有多个参数，参数与参数之间用“&”作为分隔符。

6.锚部分：HTTP请求不包括锚部分，从“#”开始到最后，都是锚部分。本例中的锚部分是“r_70732423“。 锚点作用：打开用户页面时滚动到该锚点位置。

1.3 用户输入

用户在地址栏输入关键字后，地址栏会根据关键字来判断是搜索内容还是请求 URL。

  • 若判断为搜索内容，地址栏使用默认搜索引擎，合成新的带搜索关键字的 URL（q 后为搜索关键字） https://www.google.com/search?q=google&xxxxxx
  • 若判断内容符合 URL 规则，则地址栏会根据输入内容，合称为完整的 URL www.baidu.com => https://www.baidu.com/

当用户在浏览器中输入URL后，浏览器将对拿到的URL进行识别，从而抽取出域名字段

2.DNS解析

1.什么是DNS域名解析

IP地址是互联网上计算机唯一的逻辑地址，通过IP地址实现不同计算机之间的相互通信， 每台联网计算机都需要通过IP地址来互相联系和分别。

但由于IP地址是由一串容易混淆的数字串构成，人们很难记忆所有计算机的IP地址，这样对于我们日常工作生活访问不同网站是很困难的。基于这种背景，人们在IP地址的基础上又发展出了一种更易识别的符号化标识，这种标识由人们自行选择的字母和数字构成，相比IP地址更易被识别和记忆，逐渐代替IP地址成为互联网用户进行访问互联的主要入口。这种符号化标识就是域名。

域名虽然更易被用户所接受和使用，但计算机只能识别纯数字构成的IP地址，不能直接读取域名。因此要想达到访问效果，就需要将域名翻译成IP地址。而DNS域名解析承担的就是这种翻译效果。

2.DNS域名的层级关系

dns层级.png 上图展示了 DNS 服务器的部分层次结构，从上到下依次为根域名服务器、顶级域名服务器和权威域名服务器。域名和IP地址的映射关系必须保存在域名服务器中，供所有其他应用查询。显然不能将所有信息都储存在一台域名服务器中。DNS使用分布在各地的域名服务器来实现域名到IP地址的转换。

注意：

  • 因特网采用层次树状结构的域名结构

  • 域名的结构由若干个分量组成，各分量之间用“点”隔开，分别代表不同级别的域名。

  • 每一级的域名都由英文字母和数字组成，不超过63个字符，不区分大小写字母。

  • 级别最低的域名写在最左边，而级别最高的顶级域名写在最右边。

  • 完整的域名不超过255个字符。

  • 域名系统既不规定一个域名需要包含多少个下级域名，也不规定每一级的域名代表什么意思。

  • 各级域名由其上一级的域名管理机构管理，而最高的顶级域名则由因特网名称与数字地址分配机构ICANN进行管理。

3.域名服务器的类型

  • 根域名服务器 根服务器主要用来管理互联网的主目录，最早是IPV4，全球只有13台（这13台IPv4根域名服务器名字分别为“A”至“M”），在与现有IPv4根服务器体系架构充分兼容基础上，“雪人计划”于2016年在全球16个国家完成25台IPv6根服务器架设，事实上形成了13台原有根加25台IPv6根的新格局。 image.png image.png

  • 顶级域名服务器 这些域名服务器负责管理在该顶级域名服务器注册的所有二级域名。当收到DNS查询请求时就给出相应的回答（可能是最后的结果，也可能是下一级权限域名服务器的IP地址)。

image.png

  • 权限域名服务器 这些域名服务器负责管理某个区的域名。每一个主机的域名都必须在某个权限域名服务器处注册登记。因此权限域名服务器知道其管辖的域名与IP地址的映射关系。另外，权限域名服务器还知道其下级域名服务器的地址。

  • 本地域名服务器 任何一台主机在网络地址配置时，都会配置一个域名服务器作为默认域名服务器，这个默认域名服务器通常称为本地域名服务器，是主机进行域名查询过程中首先被查询的域名服务器。

4.DNS域名解析过程

域名解析包含两种查询方式，分别是递归查询和迭代查询。

第一步：本地电脑会检查浏览器缓存中有没有这个域名对应的解析过的IP地址，如果缓存中有，这个解析过程就结束。 DNS2.png

第二步：如果浏览器缓存中没有数据，浏览器会查找操作系统缓存中是否有这个域名对应的DNS解析结果。操作系统也有一个域名解析的过程，在Windows中可以通过C:\Windows\System32\drivers\etc\hosts文件来设置，在Linux中可以通过/etc/hosts文件来设置，用户可以将任何域名解析到任何能够访问的IP地址。例如，我们在测试时可以将一个域名解析到一台测试服务器上，这样不用修改任何代码就能测试到单独服务器上的代码的业务逻辑是否正确。正是因为有这种本地DNS解析的规程，所以有黑客就可能通过修改用户的域名来把特定的域名解析到他指定的IP地址上，导致这些域名被劫持。

第三步：前两个过程无法解析时，就要用到我们网络配置中的"DNS服务器地址"了。操作系统会把这个域名发送给这个本地DNS服务器。每个完整的内网通常都会配置本地DNS服务器，例如用户是在学校或工作单位接入互联网，那么用户的本地DNS服务器肯定在学校或工作单位里面。它们一般都会缓存域名解析结果，当然缓存时间是受到域名的失效时间控制的。大约80%的域名解析到这里就结束了，后续的DNS迭代和递归也是由本地DNS服务器负责。

windows在这配置：控制面板-》网络和Internet-》网络和共享中心-》更改适配器设置-》以太网2》Internet协议版本4(TCP/IPv4)-》配置DNS地址。

更改DNS.png DNS3.png

- 【DNS递归查询】

如果主机所询问的本地域名服务器不知道被查询域名的 IP 地址，那么本地域名服务器就以 DNS 客户端的身份，向其他根域名服务器继续发出查询请求报文，即替主机继续查询，而不是让主机自己进行下一步查询。

我们以一个例子来了解DNS递归查询的工作原理，假设图中的主机 (IP地址为m.xyz.com) 想知道域名y.abc.com的IP地址。

1、主机首先向其本地域名服务器进行递归查询。

2、本地域名服务器收到递归查询的委托后，也采用递归查询的方式向某个根域名服务器查询。

3、根域名服务器收到递归查询的委托后，也采用递归查询的方式向某个顶级域名服务器查询。

4、顶级域名服务器收到递归查询的委托后，也采用递归查询的方式向某个权限域名服务器查询。

递归查询.png 当查询到域名对应的IP地址后，查询结果会在之前受委托的各域名服务器之间传递，最终传回给用户主机。

递归查询2.png

- 【DNS迭代查询】

当根域名服务器收到本地域名服务器发出的迭代查询请求报文时，要么给出所要查询的IP 地址，要么告诉本地服务器下一步应该找哪个域名服务器进行查询，然后让本地服务器进行后续的查询。

迭代查询过程如下：

1、主机首先向其本地域名服务器进行递归查询。

2、本地域名服务器采用迭代查询，它先向某个根域名服务器查询。

3、根域名服务器告诉本地域名服务器，下一次应查询的顶级域名服务器的IP地址。

4、本地域名服务器向顶级域名服务器进行迭代查询。

5、顶级域名服务器告诉本地域名服务器，下一次应查询的权限域名服务器的IP地址。

6、本地域名服务器向权限域名服务器进行迭代查询。

7、权限域名服务器告诉本地域名服务器所查询的域名的IP地址。

8、本地域名服务器最后把查询的结果告诉主机。

迭代查询.png

由于递归查询对于被查询的域名服务器负担太大，通常采用以下模式：从请求主机到本地域名服务器的查询是递归查询，而其余的查询是迭代查询。

【递归查询和递归查询区别】

  • 递归查询: 如果主机所询问的本地域名服务器不知道被查询域名的 IP 地址，那么本地域名服务器就以 DNS 客户端的身份，向其他根域名服务器继续发出查询请求报文，即替主机继续查询，而不是让主机自己进行下一步查询。

  • 迭代查询： 当根域名服务器收到本地域名服务器发出的迭代查询请求报文时，要么给出所要查询的IP 地址，要么告诉本地服务器下一步应该找哪个域名服务器进行查询，然后让本地服务器进行后续的查询。

- 【高速缓存】

为了提高DNS的查询效率，并减轻根域名服务器的负荷和减少因特网上的DNS查询报文数量，在域名服务器中广泛地使用了高速缓存。高速缓存用来存放最近查询过的域名以及从何处获得域名映射信息的记录。

由于域名到IP地址的映射关系并不是永久不变，为保持高速缓存中的内容正确，域名服务器应为每项内容设置计时器并删除超过合理时间的项（例如，每个项目只存放两天)。

高速缓存.png 如果本地域名服务器不久前已经有用户查询过域名为y.abc.com的IP地址，则本地域名服务器的高速缓存中应该存有该域名对应的IP地址。因此，直接把高速缓存中存放的上次查询结果(即y.abc.com的IP地址)告诉用户。

3.浏览器与网站建立TCP连接（三次握手）

所谓的三次握手即TCP连接的建立。这个连接必须是一方主动打开，另一方被动打开的。以下为客户端主动发起连接的图解：

image.png 握手之前主动打开连接的客户端结束CLOSED阶段，被动打开的服务器端也结束CLOSED阶段，并进入LISTEN阶段。随后开始“三次握手”：

第一次握手：首先客户端向服务器端发送一段TCP报文，其中：

  • 标记位为SYN，表示“请求建立新连接”;
  • 序号为Seq=X（X一般为1）；

随后客户端进入SYN-SENT阶段。

第二次握手：服务器端接收到来自客户端的TCP报文之后，结束LISTEN阶段。并返回一段TCP报文，其中：

  • 标志位为SYN和ACK，表示“确认客户端的报文Seq序号有效，服务器能正常接收客户端发送的数据，并同意创建新连接”（即告诉客户端，服务器收到了你的数据）；
  • 序号为Seq=y；确认号为Ack=x+1，表示收到客户端的序号Seq并将其值加1作为自己确认号Ack的值；

随后服务器端进入SYN-RCVD阶段。

第三次握手：客户端接收到来自服务器端的确认收到数据的TCP报文之后，明确了从客户端到服务器的数据传输是正常的，结束SYN-SENT阶段。并返回最后一段TCP报文。其中：

  • 标志位为ACK，表示“确认收到服务器端同意连接的信号”（即告诉服务器，我知道你收到我发的数据了）；
  • 序号为Seq=x+1，表示收到服务器端的确认号Ack，并将其值作为自己的序号值；
  • 确认号为Ack=y+1，表示收到服务器端序号Seq，并将其值加1作为自己的确认号Ack的值；
  • 随后客户端进入ESTABLISHED阶段。

服务器收到来自客户端的“确认收到服务器数据”的TCP报文之后，明确了从服务器到客户端的数据传输是正常的。结束SYN-SENT阶段，进入ESTABLISHED阶段。

在客户端与服务器端传输的TCP报文中，双方的确认号Ack和序号Seq的值，都是在彼此Ack和Seq值的基础上进行计算的，这样做保证了TCP报文传输的连贯性。一旦出现某一方发出的TCP报文丢失，便无法继续"握手"，以此确保了"三次握手"的顺利完成。

此后客户端和服务器端进行正常的数据传输。

三次握手.gif

4.客户端发起http请求

http是基于tcp的，所以只有在建立了tcp以后，客户端才能向服务器发起http请求。 这个请求报文会包括这次请求的信息，主要是请求方法，请求说明和请求附带的数据，并将这个 http 请求封装在一个 tcp 包中；这个 tcp 包也就是会依次经过传输层、网络层、数据链路层，物理层到达服务器，服务器解析这个请求来作出响应；返回相应的 html 给浏览器；

5.服务器处理请求

服务器从在固定的端口接收到TCP报文开始，它会对TCP连接进行处理，对HTTP协议进行解析，并按照报文格式进一步封装成HTTP Request对象，供上层使用。

6.服务器响应请求

服务器收到了我们的请求，也处理我们的请求，到这一步，它会把它的处理结果返回，也就是返回一个HTPP响应。

7.浏览器解析html

客户端拿到服务器端传输来的文件，找到HTML和MIME文件，通过MIME文件，浏览器知道要用页面渲染引擎来处理HTML文件。

1.浏览器会解析html源码，然后创建一个 DOM树。

在DOM树中，每一个HTML标签都有一个对应的节点，并且每一个文本也都会有一个对应的文本节点。

2.浏览器解析CSS代码，计算出最终的样式数据，形成css对象模型CSSOM。

首先会忽略非法的CSS代码，之后按照浏览器默认设置——用户设置——外链样式——内联样式——HTML中的style样式顺序进行渲染。

3.利用DOM和CSSOM构建一个渲染树（rendering tree）。

4.浏览器就根据渲染树直接把页面绘制到屏幕上。

8.断开TCP连接（四次挥手）

所谓的四次挥手即TCP连接的释放(解除)。连接的释放必须是一方主动释放，另一方被动释放。以下为客户端主动发起释放连接的图解：

四次挥手.jpeg

挥手之前主动释放连接的客户端结束ESTABLISHED阶段。随后开始“四次挥手”：

第一次挥手：首先客户端想要释放连接，向服务器端发送一段TCP报文，其中：

  • 标记位为FIN，表示“请求释放连接“；
  • 序号为Seq=U；

随后客户端进入FIN-WAIT-1阶段，即半关闭阶段。并且停止在客户端到服务器端方向上发送数据，但是客户端仍然能接收从服务器端传输过来的数据。

注意：这里不发送的是正常连接时传输的数据(非确认报文)，而不是一切数据，所以客户端仍然能发送ACK确认报文。

第二次挥手：服务器端接收到从客户端发出的TCP报文之后，确认了客户端想要释放连接，随后服务器端结束ESTABLISHED阶段，进入CLOSE-WAIT阶段（半关闭状态） 并返回一段TCP报文，其中：

  • 标记位为ACK，表示“接收到客户端发送的释放连接的请求”；
  • 序号为Seq=V；
  • 确认号为Ack=U+1，表示是在收到客户端报文的基础上，将其序号Seq值加1作为本段报文确认号Ack的值；

随后服务器端开始准备释放服务器端到客户端方向上的连接。

客户端收到从服务器端发出的TCP报文之后，确认了服务器收到了客户端发出的释放连接请求，随后客户端结束FIN-WAIT-1阶段，进入FIN-WAIT-2阶段

【前"两次挥手"既让服务器端知道了客户端想要释放连接，也让客户端知道了服务器端了解了自己想要释放连接的请求。于是，可以确认关闭客户端到服务器端方向上的连接了】

第三次挥手：服务器端自从发出ACK确认报文之后，经过CLOSED-WAIT阶段，做好了释放服务器端到客户端方向上的连接准备，再次向客户端发出一段TCP报文， 其中：

  • 标记位为FIN，ACK，表示“已经准备好释放连接了”。注意：这里的ACK并不是确认收到服务器端报文的确认报文。
  • 序号为Seq=W；确认号为Ack=U+1； 表示是在收到客户端报文的基础上，将其序号Seq值加1作为本段报文确认号Ack的值。

随后服务器端结束CLOSE-WAIT阶段，进入LAST-ACK阶段。并且停止在服务器端到客户端的方向上发送数据，但是服务器端仍然能够接收从客户端传输过来的数据。

第四次挥手：客户端收到从服务器端发出的TCP报文，确认了服务器端已做好释放连接的准备，结束FIN-WAIT-2阶段，进入TIME-WAIT阶段，并向服务器端发送一段报文，其中：

  • 标记位为ACK，表示“接收到服务器准备好释放连接的信号”。
  • 序号为Seq=U+1；表示是在收到了服务器端报文的基础上，将其确认号Ack值作为本段报文序号的值。
  • 确认号为Ack=W+1；表示是在收到了服务器端报文的基础上，将其序号Seq值作为本段报文确认号的值。

随后客户端开始在TIME-WAIT阶段等待2MSL

服务器端收到从客户端发出的TCP报文之后结束LAST-ACK阶段，进入CLOSED阶段。由此正式确认关闭服务器端到客户端方向上的连接。

客户端等待完2MSL之后，结束TIME-WAIT阶段，进入CLOSED阶段，由此完成“四次挥手”。

【后“两次挥手”既让客户端知道了服务器端准备好释放连接了，也让服务器端知道了客户端了解了自己准备好释放连接了。于是，可以确认关闭服务器端到客户端方向上的连接了，由此完成“四次挥手”。】

？为什么“握手”是三次，“挥手”却要四次？

TCP建立连接时之所以只需要"三次握手"，是因为在第二次"握手"过程中，服务器端发送给客户端的TCP报文是以SYN与ACK作为标志位的。SYN是请求连接标志，表示服务器端同意建立连接；ACK是确认报文，表示告诉客户端，服务器端收到了它的请求报文。

即SYN建立连接报文与ACK确认接收报文是在同一次"握手"当中传输的，所以"三次握手"不多也不少，正好让双方明确彼此信息互通。

image.png

TCP释放连接时之所以需要“四次挥手”,是因为FIN释放连接报文与ACK确认接收报文是分别由第二次和第三次"握手"传输的。为何建立连接时一起传输，释放连接时却要分开传输？

建立连接时，被动方服务器端结束CLOSED阶段进入“握手”阶段并不需要任何准备，可以直接返回SYN和ACK报文，开始建立连接。释放连接时，被动方服务器，突然收到主动方客户端释放连接的请求时并不能立即释放连接，因为还有必要的数据需要处理，所以服务器先返回ACK确认收到报文，经过CLOSE-WAIT阶段准备好释放连接之后，才能返回FIN释放连接报文。

四次挥手.jpeg 所以是“三次握手”，“四次挥手”。

？为什么客户端在TIME-WAIT阶段要等2MSL?

为的是确认服务器端是否收到客户端发出的ACK确认报文

当客户端发出最后的ACK确认报文时，并不能确定服务器端能够收到该段报文。所以客户端在发送完ACK确认报文之后，会设置一个时长为2MSL的计时器。MSL指的是Maximum Segment Lifetime：一段TCP报文在传输过程中的最大生命周期。2MSL即是服务器端发出为FIN报文和客户端发出的ACK确认报文所能保持有效的最大时长。

服务器端在1MSL内没有收到客户端发出的ACK确认报文，就会再次向客户端发出FIN报文；

如果客户端在2MSL内，再次收到了来自服务器端的FIN报文，说明服务器端由于各种原因没有接收到客户端发出的ACK确认报文。客户端再次向服务器端发出ACK确认报文，计时器重置，重新开始2MSL的计时；否则客户端在2MSL内没有再次收到来自服务器端的FIN报文，说明服务器端正常接收了ACK确认报文，客户端可以进入CLOSED阶段，完成“四次挥手”。

所以，客户端要经历时长为2SML的TIME-WAIT阶段；这也是为什么客户端比服务器端晚进入CLOSED阶段的原因。


参考资料：

[1] [详解URL的组成_波杰克男的博客-CSDN博客_url组成](https://blog.csdn.net/ergouge/article/details/8185219)

[2] [DNS域名详细解析过程-CSDN博客_dns解析过程](https://blog.csdn.net/bangshao1989/article/details/121913780)

[3] [浏览器输入URL后发生了什么_哔哩哔哩_bilibili](https://www.bilibili.com/video/BV1aN411o7ah?spm_id_from=333.337.search-card.all.click)

[4] [TCP 通信：三次握手，四次挥手_JIseven的博客-CSDN博客_浏览器三次握手和四次挥手](https://blog.csdn.net/qq_37833745/article/details/120762450)

[5] [从输入URL到页面展示发生了什么？-CSDN博客_](https://blog.csdn.net/m0_59140023/article/details/125356950)

[6] [多张图带你彻底搞懂DNS域名解析过程 (uml.org.cn)](http://www.uml.org.cn/xjs/202203084.asp)
avatar
文章
阅读
粉丝