Open XiZev opened 3 years ago
当用户在地址栏中输入一个查询关键字时,地址栏会判断输入的关键字是搜索内容,还是请求的URL。
如果是搜索内容,地址栏会使用浏览器默认的搜索引擎,来合成新的带搜索关键字的URL。
如果判断输入内容符合URL规则,比如输入的是 www.baidu.com,那么地址栏会根据规则,把这段内容加上协议,合成为完整的URL,如 https://www.baidu.com。
当用户输入关键字并键入回车之后,浏览器开始加载一个地址,标签页上的图标进入了加载状态。但此时图中页面显示的依然是之前打开的页面内容,并没立即替换为最新页面。因为需要等待提交文档阶段,页面内容才会被替换。
接下来进入了页面资源请求过程。这时,浏览器进程会通过进程间通信(IPC)把URL请求发送至网络进程,网络进程接收到URL请求后,会在这里发起真正的URL请求流程。具体流程是:
重定向 在接收到服务器返回的响应头后,网络进程开始解析响应头,如果发现返回的状态码是301或者302,那么说明服务器需要浏览器重定向到其他URL。这时网络进程会从响应头的Location字段里面读取重定向的地址,然后再发起新的HTTP或者HTTPS请求,一切又重头开始了。
响应数据类型处理 在处理了跳转信息之后,我们继续导航流程的分析。URL请求的数据类型,有时候是一个下载类型,有时候是正常的HTML页面,那么浏览器是如何区分它们呢? 答案是Content-Type。Content-Type是HTTP头中一个非常重要的字段, 它告诉浏览器服务器返回的响应体数据是什么类型,然后浏览器会根据Content-Type的值来决定如何显示响应体的内容。
如果Content-Type字段的值被浏览器判断为下载类型,那么该请求会被提交给浏览器的下载管理器,同时该URL请求的导航流程就此结束。但如果是HTML,那么浏览器则会继续进行导航流程。由于Chrome的页面渲染是运行在渲染进程中的,所以接下来就需要准备渲染进程了。
默认情况下,Chrome会为每个页面分配一个渲染进程,每打开一个新页面就会配套创建一个新的渲染进程。但是,在某些情况下,浏览器会让多个页面直接运行在同一个渲染进程中。
同一站点(same-site):根域名(例如,geekbang.org)加上协议(例如,https:// 或者http://),还包含了该根域名下的所有子域名和不同的端口,比如下面这三个: https://zhidao.baidu.com https://www.baidu.com https://www.baidu.com:8080
- 通常情况下,打开新的页面都会使用单独的渲染进程;
- 如果从A页面打开B页面,且A和B都属于同一站点的话,那么B页面复用A页面的渲染进程;如果是其他情况,浏览器进程则会为B创建一个新的渲染进程。
渲染进程准备好之后,还不能立即进入文档解析状态,因为此时的文档数据还在网络进程中,并没有提交给渲染进程,所以下一步就进入了提交文档阶段。
首先要明确一点,这里的“文档”是指URL请求的响应体数据。
“提交文档”的消息是由浏览器进程发出的,渲染进程接收到“提交文档”的消息后,会和网络进程建立传输数据的“管道”。
等文档数据传输完成之后,渲染进程会返回“确认提交”的消息给浏览器进程。
浏览器进程在收到“确认提交”的消息后,会更新浏览器界面状态,包括了安全状态、地址栏的URL、前进后退的历史状态,并更新Web页面。
一旦文档被提交,渲染进程便开始页面解析和子资源加载了。
页面生成完成后,渲染进程会发送一个消息给浏览器进程,浏览器接收到消息后,会停止标签图标上的加载动画。
至此,一个完整的页面就生成了。