本文浏览器以谷歌浏览器举例说明，开始之前，你需要知道目前谷歌浏览器是多进程浏览器，进程包括网路进程,渲染进程,浏览器进程等多个进程（以后有空会分享一个谷歌浏览器的发展史），那么到底这个过程都发生了什么呢？且听我一步一步分析～

1，首先当用户在地址栏输入信息的时候，浏览器会首先辨认你搜索的是一个关键字的索引还是一个网址，如果是一个索引内容的时候，就会把你的关键字+默认的搜索引擎合成新的URL；比如我在地址栏输入shanyeqiaozhi就会出现这样的拼接URL：google.com/searchq=shanyiqiaozhi&oq=shanyiqiaozhi&aqs=谷歌..69i57.3032j0j1&sourceid=谷歌&ie=UTF-8。 但是当你在地址栏直接搜索baidu.com的时候，这样的搜索符合URL规则，浏览器会根据URL协议，在baidu.com的前面加上协议变成合法的URL。(https://www.baidu.com)。

2，当你输入完内容之后，点击搜索或者按下回车键，浏览器前进后退箭头的后面那个循环标志会动起来，告诉页面开始进入loading状态，但是页面不会马上呈现新的页面，因为新的页面的相应数据并没有获取到。

3，此时，浏览器开始发起请求，浏览器进程构建请求头信息，通过进程间（上述的多进程）的通信（IPC）将URL请求发送到浏览器的网络进程中。

4，网络进程得到URL，首先会去本地缓存中查找是否有以前的缓存文件，如果找到，网络进程会拦截请求，停止操作，直接返回缓存数据。否则的话，会继续发送请求。

5，发送请求的第一步，请求DNS返回域名对应的IP和端口号，如果DNS数据缓存服务器也对当前的域名信息进行过缓存（如127.0.0.1一般代表localhost本地域名）。否则发起请求根据域名分析出来的IP和端口，如果没有端口，一般http默认的端口是80,https默认的端口是443。如果是https请求，还会进行TLS链接保证数据传输安全。

6，接下来会进入TCP链接，但是谷歌有个机制，在同一个域名之下，同时最多能建立6个TCP连接，如果当前的请求数量少于6个，会直接进行TCP连接，否则的话，会等待连接。

7，这一步涉及到底层传输数据，简而言之，TCP进行三次握手建立连接，此刻，http请求会加上TCP头部---包括源端口号，目的程序端口号和用于检验数据完整性的序号，向下传输，到达网络层，网络层在数据包上加上IP头部---包括源IP地址和目的IP地址，继续向下传输到底层，底层通过物理网络传输给目的服务器主机，目的服务器主机的网络层接收到了数据包，解析处IP地址，识别出数据部分，将解开的数据包向上传输到传输层，目的服务器的传输层接受到数据后，解析出TCP头部，识别端口，将解开的数据包向上传输到应用层，应用层HTTP解析请求头和请求体，如果需要重定向（后端可以重定向响应地址）HTTP直接返回HTTP响应数据的状态的code值为300/301，同时在请求头的location字段中附加重定向地址，浏览器则根据code和location进行重定向操作；如果不是重定向，首先服务器会根据请求头的if-none-match的值来判断请求资源是否被更新。如果没有更新，就返回304状态码，为了告诉浏览器以前的缓存数据你可以使用，就不用返回给你数据了，否则返回新数据，并且设置code为200。如果浏览器想让浏览器进行缓存数据的话，就在响应的头部加上字段：Cache-Contorl:Max-age=2000。此刻，响应数据又顺着应用层---传输层---网络层---底层（IP寻址）---网络层---传输层---应用层的顺序返回到浏览器的网络进程中。

8，网络进程此刻根据响应头的Content-Type字段进行判断响应数据的类型，如果是字节流类型，就将该请求交给下载管理器，该导航流程就结束了，不再进行。如果是HTML类型，就通知浏览器进程获取到文档进行渲染。

9，浏览器进程获取到通知，根据当前页面是否在同一站点（同根域名同协议）来决定是否开启新的渲染进程。如果是则复用父站点的渲染进程，否则，开启新的。（此刻完成渲染准备阶段，开始数据交流）

10，浏览器会发出“提交文档”的信息给渲染进程，渲染进程收到信息后，会和网络进程建立数据传输的“管道”直接进行数据的传输，文档数据传输完成后，渲染进程会返回“确认提交”的信息给浏览器进程。

11，浏览器收到“提交文档”之后，会更新浏览器的页面状态，包括了安全状态，地址栏的URL，前进后退的历史状态，并更新web页面，但此时web页面是空白页面。

12，至此，导航流程就算结束，开始进行到渲染阶段......

至于渲染阶段，渲染进程如果解析html文档，如何识别css文件进行排列页面。今日天色已晚，我们下回分解！

版权申明：本站文章均来自网络，如有侵权，请联系01056159998 邮箱：itboby@foxmail.com
特别注意：本站所有转载文章言论不代表本站观点，本站所提供的摄影照片，插画，设计作品，如需使用，请与原作者联系，版权归原作者所有