当然，如果缓存搜索失败，就会开始处理网络请求。
3.准备IP地址和端口
在了解网络请求之前，我们首先需要了解HTTP和TCP之间的关系。 HTTP 连接之所以有效，是因为浏览器使用HTTP 协议作为应用层协议来封装请求的文本信息，并使用TCP/IP 作为传输层协议将其发送到网络。也就是说，HTTP的内容是通过TCP的数据传输阶段来实现的。结合下面的图可以更好的理解两者之间的关系。
现在考虑这“组”问题。
结合上图，HTTP网络请求的第一步是与服务器建立TCP连接。
您有建立连接的信息吗？在我之前的文章中，我提到建立TCP连接的第一步是准备IP地址和端口号。
那么如何获取IP地址和端口号呢？既然我有了URL地址，我可以使用该URL地址来获取IP和端口信息吗？
我们介绍过数据包是通过IP地址发送给接收者的。 IP地址是数字标识符，因此例如极客时间网站的IP是39.106.233.176，这很难记住，但使用极客时间的域名（time.geekbang）就更容易记住。org），因此另一个服务根据此请求发挥作用，并在域名和IP 地址之间创建一对一的映射。这种将域名映射到IP的系统称为“域名系统”，简称DNS（Domain Name System）。
因此，如果我们从头到尾推理一遍，我们就会看到，在第一步中，浏览器请求DNS 并返回与域名对应的IP。当然，浏览器也提供DNS数据缓存服务。如果域名解析成功，浏览器会缓存解析结果，以便下次查询时直接使用。这也减少了一次网络请求。
获得IP 后，您需要获取端口号。通常，如果URL 未指定端口号，则HTTP 协议默认为端口80。
4. 在TCP队列中等待
现在我们已经有了端口和IP 地址，下一步就是建立TCP 连接，对吗？
答案仍然是否定的。 Chrome 仅允许6 个同时TCP 连接到同一域名，因此，如果有10 个同时请求同一域名的请求，则其中4 个请求将排队。正在进行的请求已完成。
当然，如果当前请求数小于6，则直接进行下一步，建立TCP连接。
5.建立TCP连接
排队结束后，您终于可以愉快地与服务员握手了。在任何HTTP 工作开始之前，浏览器会通过TCP 与服务器建立连接。我们在上一篇文章中详细介绍了TCP 的工作原理，因此如果您愿意，请随时自行查看。这里我就不重复了。
6. 发送HTTP请求
一旦建立了TCP连接，浏览器就可以与服务器进行通信。在此通信过程中发送HTTP数据。
下图帮助您了解浏览器如何向服务器发送请求信息。
首先，浏览器向服务器发送请求行，其中包括请求方法、请求URI（统一资源标识符）和HTTP版本协议。
7、服务器端处理HTTP请求处理
经过一番努力，HTTP请求信息终于传递到了服务器。服务器然后根据浏览器的请求信息准备相应的内容。
1. 返回请求
一旦服务器完成处理，数据就可以返回给浏览器。返回的请求数据可以通过工具软件Curl查看。具体用法是在命令行输入以下命令：
卷曲-i https://time.geekbang.org/
此处添加-i 返回响应行、响应标头和响应正文数据。这些数据一起可以帮助您了解服务器如何响应浏览器。
首先，服务器返回包含协议版本和状态代码的响应行。
但并不是所有的请求都能被服务器处理，那么如果有些信息无法处理或者处理不正确怎么办？我会告诉你结果。
然后，服务器将响应标头与响应一起发送到浏览器，就像浏览器将请求标头与请求一起发送一样。响应头包含有关服务器本身的信息，例如服务器生成返回数据的时间、返回数据的类型（JSON、HTML、流媒体等）以及服务器请求的任何cookie。减轻客户的负担。
发送响应头后，服务器可以继续发送响应正文数据。响应正文通常包含HTML 格式的实际内容。
2. 断开连接
通常，服务器将请求的数据返回给客户端，然后关闭TCP 连接。但是，如果浏览器或服务器添加：
连接：保持活动
TCP 连接在发送后保持打开状态，允许浏览器继续通过同一TCP 连接发送请求。保持TCP连接可以节省下一次请求建立连接所需的时间，并加快资源加载速度。例如，网页中嵌入的图像都来自同一个网站，因此一旦初始化了持久连接，您就可以重用该连接，而无需重新建立新的TCP 连接。
3. 重定向
看起来请求过程到这里就差不多结束了，但是还有一种情况你需要了解。例如，如果您在浏览器中打开geekbang.org，您将看到最终页面的地址是https://www。geekbang.org。
这两个URL 不同的原因是因为涉及到重定向操作。和之前一样，可以使用curl来请求geekbang.org?看看返回了什么内容。
在控制台中键入以下命令：
卡尔-I geekbang.org
这里输入的参数是-I，与-i不同。 -I 表示只需要获取响应头和响应行数据，而不是最终返回的响应体数据。如下图所示。
可以看到，响应行返回的状态码是301。状态301 告诉浏览器需要重定向到另一个URL，应该重定向到哪个URL。然后浏览器获取“位置”字段中的地址并使用该地址进行重定向。这是执行完整重定向的过程。这也解释了为什么虽然输入的是geekbang.org，但最终打开的却是https://www.geekbang.org。
但不要认为这种飞跃是不可避免的。当您打开https://12306.cn时，您会发现该网站无法打开。这是因为12306服务器不处理跳转，必须手动输入完整的https://www.12306.cn才能打开页面。
为什么很多网站第二次打开速度很快？
====================================================================================
如果第二页打开速度很快，主要原因是第一页加载过程中耗时数据被缓存了。
那么缓存了哪些数据呢？从上面介绍的核心请求路径可以看到，浏览器缓存了两部分数据：DNS缓存和页面资源缓存。其中，DNS缓存主要将域名与浏览器本地对应的IP关联起来。这里我就不过多分析了。
我们来看看浏览器的资源缓存。缓存过程如下：
首先我们看一下服务器是如何在浏览器中缓存数据的。
从上图中第一个请求可以看出，当服务器向浏览器返回HTTP响应头时，浏览器通过响应头的Cache-Control字段设置是否缓存资源。通常，您还需要为此资源设置缓存过期时间。该时间由Cache-Control Max-age 参数设置。例如上图中设置的缓存过期时间为2000秒。
缓存控制：最大周期=2000
这意味着，如果缓存的资源没有过期，那么如果再次请求该资源，将直接将缓存中的资源返回给浏览器。
然而，即使缓存过期后，浏览器仍会继续发起网络请求，例如：
如果-无-Match:“4f80f-13c-3a1xb12a”
服务器收到请求头后，根据If-None-Match值判断所请求的资源是否已更新，如果资源已更新，则服务器直接向浏览器返回提供最新的资源。
简而言之，这些网站将许多资源缓存在本地，让您可以直接使用本地副本，而无需生成实际的网络请求，从而节省时间。同时，DNS数据也被浏览器缓存，节省了DNS查询的步骤。
最后
前端开发难吗？这是计算机领域经常使用的一句话。俗话说：“如果可以，就不难”。这是因为某个领域的技术如果难以理解，就会被认为“困难”或“不困难”。这项技术无法做到，但是做到这一点需要多少钱？ 这只是时间问题，并没有什么困难，只是“懂得做事就不难”。
我们专门为初学者整理了前端学习资料。
删除DNS 查询链接。
最后
前端开发难吗？这是计算机领域经常使用的一句话。俗话说：“如果可以，就不难”。这是因为某个领域的技术如果难以理解，就会被认为“困难”或“不困难”。这项技术无法做到，但是做到这一点需要多少钱？ 这只是时间问题，并没有什么难的，只是“知道怎么做就不难了”。
我们专门为初学者整理了前端学习资料。
[外部链接图像正在传输.(img-MNYmr3U0-1719253454801)]
#浏览器原理与实践—— 以上HTTP请求流程相关内容来源仅供参考。相关信息请参见官方公告。
原创文章，作者：CSDN，如若转载，请注明出处：https://www.sudun.com/ask/92218.html
