URL地址解析至页面展示全过程(面试详细解答)

目录

1、解析URL

2、缓存判断

​编辑3、DNS解析

​编辑4、获取MAC地址

5、TCP三次握手

6、HTTP请求

7、服务器处理请求,返回HTTP响应

8、页面渲染

9、TCP四次挥手

10、浏览器解析HTML

11、浏览器布局渲染


1、解析URL

首先会对 URL 进行解析,分析所需要使用的传输协议和请求的资源的路径。如果输入的 URL 中的协议或者主机名不合法,将会把地址栏中输入的内容传递给搜索引擎。如果没有问题,浏览器会检查 URL 中是否出现了非法字符,如果存在非法字符,则对非法字符进行转义后再进行下一过程。

2、缓存判断

浏览器会判断所请求的资源是否在缓存里,如果请求的资源在缓存里并且没有失效,那么就直接使用,否则向服务器发起新的请求。

3、DNS解析

需要获取的是输入的 URL 中的域名的 IP 地址

  • 浏览器缓存

  • 操作系统缓存,hosts⽂件

  • 路由器缓存

  • ISP DNS缓存

  • DNS递归查询(可能存在负载均衡导致每次IP不⼀样)

4、获取MAC地址

当浏览器得到 IP 地址后,数据传输还需要知道目的主机 MAC 地址

判断目标地址是否与当前地址处于同一网络中,是的话直接根据 Mac 地址发送,否则使用路由表查找下一跳地址,以及使用 ARP 协议查询它的 Mac 地址。

5、TCP三次握手
  • 客户端发送⼀个TCPSYN=1Seq=X的包到服务器端口(客户端进入 SYN-SENT 状态)

  • 服务器发回SYN=1ACK=X+1Seq=Y的响应包(服务器进如SYN-RECEIVED 状态)

  • 客户端发送ACK=Y+1Seq=Z 的包到服务器端口(客户端进入ESTABLISHED 状态) ,服务器接收到包(服务器进入ESTABLISHED 状态)

6、HTTP请求

与服务器建立了连接后,就可以向服务器发起请求了

7、**服务器处理请求,**返回HTTP响应

当页面请求发送到服务器端后,服务器端会返回一个 html 文件作为响应,浏览器接收到响应后,开始对 html 文件进行解析,开始页面的渲染过程。

8、页面渲染

浏览器首先会根据 html 文件构建 DOM 树,根据解析到的 css 文件构建 CSSOM 树,如果遇到 script 标签,则判端是否含有 defer 或者 async 属性,要不然 script 的加载和执行会造成页面的渲染的阻塞。当 DOM 树和 CSSOM 树建立好后,根据它们来构建渲染树。渲染树构建好后,会根据渲染树来进行布局。布局完成后,最后使用浏览器的 UI 接口对页面进行绘制。这个时候整个页面就显示出来了。

9、TCP四次挥手

浏览器接收HTTP响应,然后根据情况选择关闭TCP连接或者保留重⽤

  • 客户端打算关闭连接,此时会发送一个 TCP 首部 FIN 标志位被置为 1 的报文,也即 FIN 报文,之后客户端进入 FIN_WAIT_1 状态。
  • 服务端收到该报文后,就向客户端发送 ACK 应答报文,接着服务端进入 CLOSE_WAIT 状态。
  • 客户端收到服务端的 ACK 应答报文后,之后进入 FIN_WAIT_2 状态。
  • 等待服务端处理完数据后,也向客户端发送 FIN 报文,之后服务端进入 LAST_ACK 状态。
  • 客户端收到服务端的 FIN 报文后,回一个 ACK 应答报文,之后进入 TIME_WAIT 状态
  • 服务端收到了 ACK 应答报文后,就进入了 CLOSE 状态,至此服务端已经完成连接的关闭。
  • 客户端在经过 2MSL 一段时间后,自动进入 CLOSE 状态,至此客户端也完成连接的关闭。
10、浏览器解析HTML

浏览器通过解析HTML,生成DOM树,解析CSS,生成CSS规则树,然后通过DOM树和CSS规则树生成渲染树。渲染树与DOM树不同,渲染树中并没有head、display为none等不必显示的节点。

解析执行JS脚本

11、浏览器布局渲染

完成解析

相关推荐
ZachOn1y5 小时前
计算机网络:应用层 —— 域名系统 DNS
网络·计算机网络·应用层·408考研·知识积累·域名系统dns
DKPT8 小时前
计算机网络之路由协议(自治系统)
开发语言·笔记·学习·计算机网络·算法
ZachOn1y12 小时前
计算机网络:应用层 —— 文件传送协议 FTP
网络·计算机网络·应用层·文件传送协议ftp·考研408·知识积累
一天八小时16 小时前
计算机网络————(一)HTTP讲解
网络协议·计算机网络·http
Jditinpc1 天前
计算机网络抄手 运输层
计算机网络
橘猫云计算机设计1 天前
基于SSM的《计算机网络》题库管理系统(源码+lw+部署文档+讲解),源码可白嫖!
java·数据库·spring boot·后端·python·计算机网络·毕设
小梁不秃捏1 天前
HTTP 常见状态码技术解析(应用层)
网络·网络协议·计算机网络·http
learning-striving1 天前
eNSP下载安装(eNsp、WinPcap、Wireshark、VirtualBox下载安装)
网络·计算机网络·华为·路由器·ensp·交换机
xiaolin03331 天前
【复习】计算机网络
计算机网络
高hongyuan2 天前
计算机网络
linux·计算机网络