俗话说的好,温故而知新。我今天翻开了自己的笔记,非常不意外的发现我把之前所学的知识都忘得一干二净。因此萌生了写博客记录知识的想法,将知识进行梳理和总结,有助于加深记忆。 好了废话不多说,让我们进入正题。 来谈谈我对从输入URL到页面展示的浏览器过程的理解。
一、用户输入
首先是用户输入URL,浏览器判断输入的信息是搜索内容还是网址
1、URL:统一资源定位符
格式:<协议类型> : / / <主机名> :<端口号> / <路径> ? <参数名># <锚点>
scheme : / / host :port / path ? query # fragment
2、用户输入内容之后,判断输入信息是否符合URL规则。
(1)如果是搜索内容,地址栏会使用浏览器默认的搜索引擎,来合成新的带有搜索关键字的URL
(2)如果是符合URL规则的内容,根据URL协议(比如https),把这段内容加上协议,合成完整合法的URL
(3)此时浏览器导航栏显示loading状态,这是因为页面的响应数据还没有获得
二、查找DNS缓存、发起DNS查询
浏览器进程浏览器构建请求行信息
浏览器进程会通过进程间通信(IPC)将URL请求发送给网络进程,如:GET /index.html HTTP1.1 网络进程收到URL之后,浏览器寻找域名的IP地址,进行DNS解析
1、DNS解析过程
浏览器DNS缓存-->操作系统缓存-->路由器缓存-->DNS缓存-->如果都没有缓存,则运营商的DNS浏览器发起迭代DNS请求,查找域名对应IP
2、另外,如果是https请求,还需要建立TLS连接
三、建立TCP连接,发送HTTP请求到服务器
网络进程发起网络请求,也就是通过IP地址发起TCP连接(三次握手)
四、服务器接收请求、处理请求并发回响应
服务器收到报文后处理请求,同时返回响应数据
五、渲染页面
1、网络进程将获取到的数据包进行解析,根据响应头中的Content-type来判断响应数据的类型,如果是字节流类型,就将该请求交给下载管理器,该导航流程结束,不再进行;如果是text/html类型,就通知浏览器进程获取到文档准备渲染。
2、浏览器进程接收到网络进程的响应头数据之后,发送CommitNavigation消息到渲染进程,发送时携带响应头等基本信息。
3、渲染进程接收到CommitNavigation消息之后,便开始接收HTML数据,接收数据的方式是直接和网络进程建立数据管道
4、最后渲染进程会向浏览器进程“确认提交”,这是告诉浏览器进程,说已经准备好了
六、显示页面
1、浏览器收到“确认提交”的消息后,会更新浏览器的页面状态,包括了安全状态、地址栏的 URL、前进后退的历史状态,并更新web页面,此时的web页面是空白页.
2、渲染进程对文档进行页面解析和子资源加载,HTML 通过HTM 解析器转成DOM Tree(二叉树类似结构的东西),CSS按照CSS 规则和CSS解释器转成CSSOM TREE,两个tree结合,形成render tree(不包含HTML的具体元素和元素要画的具体位置),通过Layout可以计算出每个元素具体的宽高颜色位置,结合起来,开始绘制,最后显示在屏幕中新页面显示出来
至此,一个页面展示过程才基本完成。
通过本次对于这个看似简单的问题的学习,我发现里面串联了许多的知识,关于http协议,TCP连接,TLS连接,渲染过程等等。