本篇均以输入’www.baidu.com’为例
DNS解析
网络通讯大多数都是基于TCP/IP
的,而TCP/IP
又是基于IP
的。我们输入的域名并不能被计算机网络所识别,因此需要将域名转为IP,而这个过程叫就做DNS解析。
基本概念
DNS(Domain Name System)
即计算机域名系统,它由域名解析器和域名服务器组成。
域名服务器:指保存有该网络中所有主机的域名和对应IP地址,并具有将域名转换为IP地址功能的服务器。
其中域名必须对应一个,且只能对应一个IP地址;而IP地址不一定有域名而且可以对应多个域名。
DNS也是应用层协议,但他是为了其他应用层协议工作的,用于将用户提供的域名解析为IP地址。
DNS主要基于UDP传输层协议,
根域
根域就是所谓的.
。
其实我们的网址www.baidu.com
在配置当中应该是www.baidu.com.
(最后多了一个.)。一般我们在浏览器里输入的时候都会省略这个.
。
域的划分
根域下来就叫顶级域或一级域。有两种划分方式,一种是互联网刚兴起时划分的com.
,net.
等;一种是按国家划分的如cn.
,jp.
等,每个域都有域名服务器。
例如 .com
就是一个顶级域名;而 www.baidu.com
不是一个域名,它是baidu.com
这个域名里的一个叫做www
的主机。同理,在a.www.baidu.com
里,主机名是a
。
解析过程
具体过程如下:
- 查询本地域名服务器(10.1.1.1),查找本地缓存中是否有
www.baidu.com
的IP地址。如果在缓存中找到,则跳到#6
,没有找到则进行下一步; - 在根域名服务器(.)中查询 -> 返回COM顶级域名服务器的IP
- 在COM顶级域名服务器(.com)中查询 -> 返回baidu.com二级域名服务器(.baidu.com)的IP
- 在baidu.com二级域名服务器(.baidu.com)中查询 -> 返回主机名为
www
的服务器的IP - 将域名及对应IP存入缓存中
- 获得域名对应IP地址
TCP 连接
获得目标服务器的IP地址和端口号之后,客户端和服务器之间将建立一条TCP/IP连接。
TCP是面向连接的、无差错的、按序传输的。
三次握手
在TCP/IP协议中,TCP协议提供可靠的连接服务,采用三次握手建立一个连接。
第一次握手:建立连接时,客户端发送syn包(syn=j)到服务器,并进入SYN_SEND状态,等待服务器确认;
第二次握手:服务器收到syn包,必须确认客户的SYN(ack=j+1),同时自己也发送一个SYN包(syn=k),即SYN+ACK包,此时服务器 进入SYN_RECV状态;
第三次握手:客户端收到服务器的SYN+ACK包,向服务器发送确认包ACK(ack=k+1),此包发送完毕,客户端和服务器进入 ESTABLISHED状态,完成三次握手。 完成三次握手,客户端与服务器开始传送数据.
四次挥手
由于TCP连接是全双工的,因此每个方向都必须单独进行关闭。这个原则是当一方完成它的数据发送任务后就能发送一个FIN来终止这个方向的连接。收到一个 FIN只意味着这一方向上没有数据流动,一个TCP连接在收到一个FIN后仍能发送数据。首先进行关闭的一方将执行主动关闭,而另一方执行被动关闭。
- 客户端A发送一个FIN,用来关闭客户A到服务器B的数据传送(报文段4)。
- 服务器B收到这个FIN,它发回一个ACK,确认序号为收到的序号加1(报文段5)。和SYN一样,一个FIN将占用一个序号。
- 服务器B关闭与客户端A的连接,发送一个FIN给客户端A(报文段6)。
- 客户端A发回ACK报文确认,并将确认序号设置为收到序号加1(报文段7)。
HTTP协议
TCP/IP连接建立之后,浏览器会向服务器发送一条HTTP请求报文 -> 服务器向浏览器返回一条相应报文 -> 关闭连接
报文
报文可分为两类: 请求报文和相应报文,它们都由三部分组成
- 起始行(对报文进行描述)
- 首部块(包含属性)
- 主体部分(包含数据-可选)
起始行
- 请求报文起始行
- 相应报文起始行
请求报文起始行:
相应报文起始行:
首部块
- 通用首部
- 请求首部
- 响应首部
- 实体首部
- 扩展首部
主体部分
是HTTP报文的负荷,也就是HTTP要传输的内容
连接方式
- 并行连接
- 持久连接
通常使用 少量并行+持久 的连接方式
HTTP/1.0 通过客户端设置请求首部 Connection: keep-alive
HTTP/1.1 默认持久连接,可以设置 Connection: close 关闭(默认持久连接并不代表连接会永远持续下去)
页面渲染
- HTML代码转化成DOM
- CSS代码转化成CSSOM(CSS Object Model)
- 结合DOM和CSSOM,生成一棵渲染树(包含每个节点的视觉信息)
- 生成布局(layout),即将所有渲染树的所有节点进行平面合成
- 将布局绘制(paint)在屏幕上
重排
发生条件:
- 页面初始化
- 插入/删除节点
- 改变元素尺寸(width/height/margin/padding/border 等等)
- 浏览器窗口变化
- 元素位置改变
重绘
发生条件:
- 重排后必有重绘
- color
- visibility
参考:
前端经典面试题: 从输入 URL 到页面加载发生了什么?
DNS解析过程详解
聊聊HTTPS和SSL/TLS协议
TCP三次握手 四次挥手全过程
网页性能管理详解