从输入 URL 到页面加载完成的过程中都发生了什么事情?

百度了一下,好像是个挺经典的面试题。
所以在此做个记录吧,也给你们你分享下~

1.浏览器接受URL

URL包含的内容:传输协议;存在该资源的服务器名称;资源在服务器上的路径和文件名称;查询字符和标识符。

2.将URL与缓存进行对比

  1. 如果请求的页面在缓存中并且未过期,浏览器根据首部字段判断是否进行缓存,如果可以,响应会被存储起来。
  2. 如果缓存过期,浏览器会进行缓存协商, 向服务器发起请求询问资源是否真正过期。
    从输入 URL 到页面加载完成的过程中都发生了什么事情?

3.如果网络地址不是一个 IP 地址,通过DNS解析域名返回一个IP地址

  1. DNS:域名系统(Domain Name System,缩写:DNS)是互联网的一项服务。用来将域名转换为IP地址(也可以将IP地址转换为相应的域名地址);它作为将域名和IP地址相互映射的一个分布式数据库,能够使人更方便地访问互联网。
  2. DNS查询:操作系统会先检查本地hosts文件是否有这个网址映射关系,如果有就调用这个IP地址映射,完成域名解析。
    否则,查找本地DNS解析器缓存,如果查找到则返回。
    否则,查找本地DNS服务器,如果查找到则返回。
    否则,①未用转发模式,按根域服务器 ->*域,.com->第二层域,example.com ->子域,www.example.com的顺序找到IP地址。
    ②用转发模式,按上一级DNS服务器->上上级->…逐级向上查询找到IP地址。

4.浏览器与服务器通过三次握手(SYN,SYN/ACK,ACK)建立TCP 连接

(不是很懂,给你们上张图看吧,在其他博主的分享里看到的)
从输入 URL 到页面加载完成的过程中都发生了什么事情?
为什么需要进行三次握手,而不是两次握手?

原因是两次握手不可靠。比如,浏览器发送一个连接请求包A,但包A在半路上堵车了,浏览器就认为包A丢失了,所以重新发生一个请求包B给服务器。服务器收到请求,建立连接。两端进行通信,结束后关闭连接。但是这时候,包A到达了服务器,服务器不知道这是一个无效的包,所以进行响应。这时两次握手已经完成,两端就建立起一个无效的连接。但浏览器认为自己没发出请求,所以不会回应,这样就让服务器白白等待回应,浪费了服务器资源。而三次握手的机制下,浏览器知道自己并没有请求连接,会发送拒绝包给服务器,服务器收到回应后也会结束这次无效的连接。

5.浏览器向服务器发送HTTP请求。

  1. 浏览器拿到index.html文件后,就开始解析其中的html代码,遇到js/css/image等静态资源时,就向服务器端去请求下载(会使用多线程下载,每个浏览器的线程数不一样),这个时候就用上keep-alive特性了,建立一次HTTP连接,可以请求多个资源,下载资源的顺序就是按照代码里的顺序,但是由于每个资源大小不一样,而浏览器又多线程请求请求资源,所以显示的顺序并不一定是代码里面的顺序。
  2. 浏览器在请求静态资源时(在未过期的情况下),向服务器端发起一个http请求(询问自从上一次修改时间到现在有没有对资源进行修改),如果服务器端返回304状态码(告诉浏览器服务器端没有修改),那么浏览器会直接读取本地的该资源的缓存文件。

6.浏览器对页面进行渲染呈现给用户

最后,浏览器利用自己内部的工作机制,把请求到的静态资源和html代码进行渲染,渲染之后呈现给用户。