网页是怎么打开的

先来看一个经典的面试题：从输入 URL 到打开网页，发生了什么？越详细越好。大致流程如下：

1. DNS 解析
2. TCP 连接（三次握手）
3. 发送 HTTP 请求
4. 服务器处理请求并返回 HTTP 报文
5. 浏览器解析渲染页面（后面细讲）
6. 连接结束（四次挥手）

本文将围绕这个问题展开，详细讲述 DNS、Server 以及浏览器的渲染原理。

DNS

输入网址后（你甚至可能还没有点回车），浏览器会先从本地缓存中搜索解析结果。

如果有自然皆大欢喜；如果没有，浏览器就会向 DNS 发送请求。通常，我们使用的是谷歌家的 8.8.8.8. DNS 会把域名解析后的结果返回客户端。

这个解析结果可能是一个 IP 地址，也可能是指向另一个域名，甚至可能是一段文本。

解析类型	作用
A	指向 IP 地址
CNAME	指向另一个域名
TXT	返回一串文本

如果返回了 IP 地址，浏览器就会向该 ip 地址发出请求，于是就到了我们要谈的 http。

地址栏前面的小锁

如何理解 Https 的工作原理？我们可以用信鸽送信的故事来理解。

小明和小红想用信鸽传一封信。小明把内容写在纸上，再绑在信鸽脚上，让信鸽带给小红。这就是 Http。

如果有中间人拦下了信鸽，就可以自由篡改内容，而小红丝毫不知道被篡改了。如何保护信息安全呢？

小明把信装进一个盒子里，并给他加上锁。小红收到信箱后，将私钥转成公钥，对比信箱上的公钥，如果一致，就可以查看内容。

于是小红小明约定了一个密钥，使用密文传输信息。这样虽然可以防止被篡改，但是不能防止被中间人拦截。

所以如何安全的传输信息呢？

如果引入第三方平台，这个平台大家都信任他。给小明颁发一个凭证，小明先去找第三方验证这个凭证（这样就能防止被中间人拦截）。验证完后用这个凭证给盒子加锁即可。

浏览器渲染

拿到页面的 Document 之后，浏览器会进行以下操作：

1. 构建 DOM （文档对象模型）树
2. 构建 CSSOM （层叠上下文对象模型）树
3. 构建渲染树