一个网页的形成过程

一个网页从我们输入网址到打开经历了以下步骤。

DNS解析

DNS（域名系统 Domain Name System）由解析器和域名服务器组成,域名服务器保存着该网络中所有主机的域名和对应的IP地址,域名有唯一对应的IP地址,但是IP地址不一定对应一个域名，我们就是根据DNS来上网的。

• 当用户输入一个网址并按下回车键时，浏览器得到一个域名。而实际通讯过程中我们需要一个IP地址。因此我们需要先把域名转化成对应的IP地址，这个过程就叫做DNS解析。

过程

简述

浏览器搜索缓存-->hosts文件和操作系统缓存-->域名解析服务器-->递归迭代
YSE-->返回给浏览器
NO-->向下找

详细描述

1. 浏览器首先搜索自身缓存的DNS记录。
2. 如果没有或记录已经过期，则搜索hosts文件和操作系统缓存。
3. 如果没有或记录已经过期，则向域名解析服务器发送解析请求。
4. 如果还是没有，则开始递归 + 迭代解析。
5. 获取域名和对应IP后，一步步向上返回，直到返回给浏览器。

发起TCP请求（三次握手）

简述

客户端（发送连接请求）-->服务器端
服务器端（建立连接并发送确认报文）-->客户端
客户端（发送确认收到确认报文）-->服务器端

详细描述

1. 客户端向服务器端发送连接请求的报文。
2. 服务器端收到请求后，同意建立连接，并向客户端发送确认报文。
3. 客户端收到后，再次向服务器端发送报文，确认已经收到确认报文。

建立起TCP连接后，开始进行通信。

建立TCP连接后，浏览器向服务器发送HTTP请求

• 如：浏览器发出取文件指令GET。

负载均衡

当一台服务器无法支持大量用户访问时，将用户分摊到两个或多个服务器上的方法叫负载均衡。

过程

简述

浏览器（发送请求）-->Nginx（建立TCP连接，转发请求）-->web服务器（发送网页）-->Nginx（传递网页）-->filter链（处理）-->浏览器

详细描述

• 一般，如果我们的平台配备了负载均衡的话，前一步DNS解析获得的IP地址应该是我们Nginx负载均衡服务器的IP地址。所以，我们的浏览器将我们的请求发送到了Nginx负载均衡服务器上。
• Nginx根据我们设定的分配算法和规则，选择一台后端的真实Web服务器，与之建立TCP连接、并转发我们浏览器发出去的网页请求。
• Web服务器收到请求，产生响应，并将网页发送给Nginx负载均衡服务器。
• Nginx负载均衡服务器将网页传递给filter链处理，之后发回给我们的浏览器。

服务器响应HTTP请求，将请求的资源发送给浏览器。

浏览器释放TCP连接（四次挥手）

浏览器（发送释放连接报文）-->服务器
服务器（发送确认报文并发送完数据）-->浏览器
服务器（发送释放连接请求）-->浏览器
浏览器（发出确认）-->服务器
等待一段时间后，浏览器释放TCP连接

• 浏览器向服务器发送释放连接报文。
• 服务器收到后，发出确认报文，然后将服务器上未传送完的数据发送完。
• 服务器数据传输完成后，向浏览器发送释放连接请求。
• 浏览器收到后，发出确认，然后等待一段时间，释放TCP连接。

浏览器渲染

浏览器接收到服务器服务器返回的HTML页面代码，在解析和渲染这个页面时，里面的JS、CSS、图片等静态资源，也是一个个HTTP请求，都需要经过上面的步骤。

• 浏览器根据页面内容，生成DOM Tree。
• 根据css内容，生成CSS Rule Tree（规则树）。
• 调用JS执行引擎执行JS代码。
• 根据DOM Tree和 CSS Rule Tree生成 Render Tree（呈现树）。
• 根据根据Render Tree渲染网页。

文章参考自https://www.jianshu.com/p/0c8c7cecf946和https://www.jianshu.com/p/cc1d185a7842