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

摘要

本文只是初步介绍了浏览器从输入URL到页面加载完成所经历的阶段，内容的详细度有待完善，望读者包容。

整体过程

域名解析；
建立TCP连接；
发起HTTP请求；
服务器处理请求并返回HTTP报文；
浏览器解析渲染页面；

DNS解析

DNS解析过程是一个网址到IP地址的转换过程，通过域名解析查找到对应的IP地址，查找过程是一个递归查询的过程：自身的DNS缓存--> 操作系统自身的DNS缓存--> 读取hosts文件--> 运营商dns --> 根域名服务器 --> 顶级域名服务器 --> 域名注册商服务器，直到最后本地域名服务器得到IP地址并把它缓存到本地。

建立TCP连接

拿到域名对应的IP地址之后，浏览器会以一个随机端口向服务器的WEB程序发起TCP的连接请求,这个连接请求到达服务器端后,进入到网卡，然后是进入到内核的TCP/IP协议栈，还有可能要经过Netfilter防火墙的过滤，最终到达WEB程序，建立TCP/IP的连接。
HTTP协议是使用TCP作为其传输层协议的，HTTP报文是包裹在TCP报文中发送的，服务器端收到TCP报文时会解包提取出HTTP报文，但是这个过程中存在一定的风险，HTTP报文是明文，如果中间被截取的话会存在一些信息泄露的风险，那么在进入TCP报文之前对HTTP做一次加密就可以解决这个问题了。

发起HTTP请求

建立TCP的连接之后，浏览器发起了http的请求，发送HTTP请求的过程就是构建HTTP请求报文并通过TCP协议中发送到服务器指定端口的过程，HTTP请求报文是由三部分组成: 请求行, 请求报头和请求正文。
[图片上传失败...(image-9eee91-1523792198700)]

服务器处理请求并返回HTTP报文

服务器在固定的端口接收到TCP报文之后，会对TCP连接进行处理：服务器解析请求，定位请求资源，将资源副本写到 TCP 连接，由客户端读取。HTTP响应报文也是由三部分组成: 状态码, 响应报头和响应报文。
[图片上传失败...(image-7b2b4e-1523792198700)]
关于HTTP协议请参考:
https://kb.cnblogs.com/page/140611/
https://kb.cnblogs.com/page/55442/

浏览器解析渲染页面

服务器对浏览器请求作出响应，并把对应的 html 文本发送给浏览器，浏览器是一个边解析边渲染的过程，首先浏览器解析HTML文件构建DOM树，然后解析CSS文件构建渲染树，其中涉及到reflow(回流)和repain(重绘)，DOM节点中的各个元素都是以盒模型的形式存在，这些都需要浏览器去计算其位置和大小等，这个过程称为relow;当盒模型的位置,大小以及其他属性确定下来之后，浏览器便开始绘制内容，这个过程称为repain。
详细的浏览器工作原理请看:https://kb.cnblogs.com/page/129756/
通过本文可以初步了解到在浏览器输入URL到看到页面所经历的过程，转载时请注明原作者。

2018-04-12