输入一条url后,发生了什么??

(1)浏览器解析

(2)查询缓存

(3)DNS查询

顺序如下,若其中一步成功直接进去建立连接部分:

-- 浏览器自身DNS

-- 操作系统DNS

-- 本地hosts文件

-- 像域名服务器发送请求

(4)建立连接

-- TCP三次握手(three-way handshaking)

-- 发送方: SYN(synchonize)

-- 接受方: SYN/ACK(acknowledgement), 确认信息传达

-- 发送方: ACK - 确认接受方再线可收消息,握手结束

-- 1, 发送端: 标有SYN的数据包发给你了

-- 2, 接收端: 明白了! 我收到你给我发的数据包了! (并发送标有SYN/ACK的数据包了)

-- 3, 明白! (发送标有ACK的数据包)

TCP三次握手的好处在于,发送方可以确认接受方仍然在线,不会因为白发送而浪费资源.

(5) 发送HTTP请求

-- 报文首部(GET/index.html HTTP/1.1)

-- 方法

-- URL

-- HTTP版本

-- 空行

-- 报文主体

注意: 1,HTTP是无连接, 无状态的,即HTTP再传输完成后就会断开,并且下一次登陆时不会记录上次的登陆状态

2,关于CR(Carriage Return, 回车)和LF(Line Feed, 换行)

Dos和Windows采用的CR/LF表示下一行

UNIX/Linux采用LF表示下一行

MAC OS系统采用CR表示下一行

(6)服务器发送响应

-- 报文首部(HTTP/1.1 200 ok)

-- HTTP版本

-- 响应状态码

-- 状态码信息

-- 空行(CR+LF)

-- 报文主体

(7)客户端收到页面

(8)解析HTML

-- 构建DOM树

-- 下载资源

-- CSS - 构建CSSSOM树

-- js - 等下载并执行后解析

(9)构建渲染树

根据DOM和CSSSOM树渲染,不可见元素不被会渲染

(10)浏览器布局渲染

-- 布局- 根据渲染书布局

-- 绘制 - 在屏幕上绘制每个点

巴特西