【前端】从输入url到页面展示到底发生了什么?

1、输入地址（www.baidu.com）

当我们开始在浏览器中输入网址的时候，浏览器其实就已经在智能的匹配可能得 url 了，他会从历史记录，书签等地方，找到已经输入的字符串可能对应的 url，然后给出智能提示，让你可以补全url地址。对于 google的chrome 的浏览器，他甚至会直接从缓存中把网页展示出来，就是说，你还没有按下 enter，页面就出来了。

2、域名解析（DNS）

我们并不能通过域名来找到对应的服务器，就像我们不能通过名字来确定一个人（虽然域名是唯一的），那么我们可以用身份证来类比ip地址。

1、请求一旦发起，我们按下回车键。浏览器首先要做的事情就是解析这个域名，一般来说，浏览器会首先查看本地硬盘的 hosts 文件，看看其中有没有和这个域名对应的规则，如果有的话就直接使用 hosts 文件里面的 ip 地址。
2、本地没有找到的话，就会去发出一个 DNS请求到本地DNS服务器 。本地DNS服务器一般都是你的网络接入服务器商提供，比如中国电信，中国移动。

3、TCP连接（三次握手）

这张图很好的展示了客户端与服务的建立tcp连接的三次握手过程。
目的：为了防止已失效的连接请求报文段突然又传送到了服务端，因而产生错误。

4、客户端发起http请求

http是基于tcp的，所以只有在建立了tcp以后，客户端才能向服务器发起http请求。
现在浏览器知道了https://www.baidu.com要去访问的服务器了，那么向该服务器发送一个http请求，此时我们并不知道服务端会返回什么。

5、服务器响应请求

在第4步中，浏览器向服务器发送了一个http请求，服务端解析该http请求，发现请求的是https://www.baidu.com，那应该返回百度首页（html文件）。此时会返回一个http响应，里面就包含了百度首页index.html的内容。

6、浏览器解析html

在浏览器没有完整接受全部HTML文档时，它就已经开始显示这个页面了，浏览器是如何把页面呈现在屏幕上的呢？
浏览器在解析html文件时，会”自上而下“加载，并在加载过程中进行解析渲染。在解析过程中，如果遇到请求外部资源时，如图片、外链的CSS、iconfont等，请求过程是异步的，并不会影响html文档进行加载。

浏览器发送请求获取嵌入在 HTML 中的资源（如图片、音频、视频、CSS、JS等等）,这与获取html一样，都是一个个http请求，全部获取到后，页面才算完整了，浏览器变将一个完整的页面渲染屏幕上。