输入URL到页面呈现之间发生了什么

这是一个很经典的问题,牵涉的方面有很多。

在这里把我现阶段的理解记录下来,以后可以重温。

不定时补充。

简要

首先,简单说一下,大概会有哪几个步骤。

  1. 查找目标 URL 对应的 IP 地址

  2. 与目标浏览器建立连接

  3. 浏览器发起请求,服务器响应

  4. 浏览器接收结果,并构建页面

下文一一解释

查找目标 IP 地址

一般来说,我们访问一个网站,都是输入它们的域名(如:github.com)来访问。但其实,域名只是方便我们记忆和输入的工具。事实上一个网站的服务器所在的计算机是以 IP 地址作为唯一标识。我们访问页面、获取页面资源时,也是通过目标计算机的 IP 地址来访问。

那么这样的话,我们输入的域名和 IP 地址肯定是通过某种方式联系起来的。

答案就是:Domain Name System(DNS)域名系统

通过 DNS,就可以获取某个域名对应的 IP 地址。

如何查找

回到原来的主题,输入 URL 后,浏览器会开始查找目标 IP 地址。

浏览器首先会按顺序在不同地方的缓存中查找是否已有记录,这些缓存包括:

  • 浏览器自己的 DNS 缓存(每次访问新的网站都会缓存)
  • 操作系统(OS)自身的缓存(也就是熟悉的 hosts 文件)
  • 地区路由的缓存

如果在这些缓存中没有查找到 IP 地址的话,就会进行 DNS 解析。

DNS 解析

DNS 可以简单理解为是一个表,可以查找 IP。现在的网站数不胜数,可想而知,如果全部记录在同一个服务器的话,不仅占用的空间无比庞大,查找的效率也极低。

因此,DNS 解析机制不是简单地去一个服务器查找,而且从根服务器开始,不断分层,有着不同层级的服务器,直到最接近用户的层级。

以 www.qq.com 举个例子来简单说明一下:
查找 IP 时,会先从根服务器匹配顶级服务器,这里的话就是 com 顶级服务器。
接着再往下找,qq.com 这个服务器。
最后是 www.qq.com 的服务器。

在找到目标服务器之后,就会返回该 IP。

与目标服务器建立连接

获取了目标服务器的 IP 之后,就可以开始和它建立连接。

建立连接的过程是通过 TCP 的三次握手协议实现。

三次握手

对于三次握手,我没有理解得很具体。

目前来讲,我认为理解大概是怎么进行的即可:
Client发起连接的请求
->Server确认,也发起了连接
->Client确认

于是这样就建立起来了。

通俗一点就是:

A:周末约吗?
B:约。这周日你有空吗?
A:走起。

建立连接的过程

网络两端建立连接的过程,涉及到 TCP 协议。

在 TCP 协议中,定义了一种协议规范—— OSI 模型。

OSI 模型目前只是接触了一些皮毛,在我另外一篇笔记会主要总结。

在四层模型中,大概过程就是:
应用层 -> 传输层 -> 网络层 (发起请求方)
-> 链路层 (信号传输介质)
-> 网络层 -> 传输层 -> 应用层 (接收请求方)

浏览器发起请求,服务器响应

建立连接后,浏览器就可以向服务器发起请求,以获取资源了。

而在这个步骤中,会涉及到 web 缓存的问题。

因为有些时候,部分资源更新的频率没有那么快。假如能把这个版本的资源保存下来并在更新之前重复利用,就可以一定程度上提高网页加载的速度。

所以,当第一次获取资源时,会根据响应头来判断并记录是否能够缓存,以及缓存时间。

如果能够使用本地缓存,浏览器就不会发请求了。

具体内容用另外一篇笔记总结。

浏览器接收结果,并构建页面

浏览器接收到服务器响应请求返回的资源后,就会开始渲染页面。

期间,可能还会发起异步请求请求数据。

具体见这篇笔记