当前位置: 首页 > Web前端 > HTML5

浏览器输入

时间:2023-04-05 18:55:23 HTML5

后会发生什么当用户输入一个URL时,浏览器会根据用户输入的信息判断是搜索还是URL。如果是搜索内容,则由搜索内容+默认搜索引擎合成一个新的URL;如果用户输入的内容符合URL规则,浏览器就会根据URL协议给内容加上协议,合成一个合法的URL。用户输入内容并按下回车键后,浏览器导航栏会显示加载状态,但页面仍会显示上一个。页面,这是因为新页面的响应数据还没有得到浏览器进程浏览器构建请求行信息,会通过进程间通信(IPC)GET/index.htmlHTTP1.0向网络进程发送URL请求。1网络进程获取到URL,先到本地缓存中查找是否有缓存文件,如果有则拦截请求,直接返回200;否则,进入网络请求流程,网络流程请求DNS返回域名对应的IP和端口号,如果DNS数据缓存服务之前缓存过当前域名信息,则直接返回缓存的信息;否则,发起请求获取根据域名解析的IP和端口号。如果没有端口号,http默认为80,https默认为443。如果是https请求,还需要建立TLS连接。Chrome有一个机制。同一个域名最多只能同时建立6个TCP连接。如果同一域名下同时有10个请求,则其中4个会进入等待状态,直到正在进行的请求完成。如果当前请求数小于6,则直接建立TCP连接。TCP三次握手建立连接,HTTP请求添加TCP头——包括源端口号、目的程序端口号和用于验证数据完整性的序列号,下行网络层添加IPheadertothedatapacket——包括源IP地址和目的IP地址,继续向下传输到底层,通过物理网络传输到目的服务器主机数据包向上传输到传输层目的服务器主机。传输层获取数据包,解析出TCP头,识别端口,将解压后的数据包向上传输给应用层。应用层HTTP解析请求头和请求体。Orientation,HTTP直接返回HTTP响应数据的状态码301或302,同时在请求头的Location字段附加重定向地址,浏览器会根据code和Location进行重定向操作;如果不是重定向,服务器首先会根据请求头中的If-None-Match的值来判断请求的资源是否已经更新。如果没有,则返回一个304状态码,相当于告诉浏览器,之前的缓存还可以使用,不会返回新的数据;否则,返回新的数据,状态码为200,如果想让浏览器缓存数据,在相应的header中添加一个字段:Cache-Control:Max-age=2000响应数据沿着applicationlayer-transport层-网络层-网络层-传输层-应用层为了返回网络的过程数据传输完成,TCP挥手四次断开连接。如果浏览器或服务器在HTTP头中加入如下信息,TCP就会一直保持连接。保持TCP连接可以节省下次建立连接所需的时间,提示资源加载速度Connection:Keep-Alive网络进程会对获取到的数据包进行分析,根据Content-type中的Content-type判断响应数据的类型responseheader,如果是字节流类型,则将请求交给下载管理器,导航过程结束,不再继续;如果是text/html类型,会通知浏览器进程获取文档,准备渲染浏览器进程。当前页面B是否是从页面A打开的,是否与页面A是同一个站点(根域名和协议视为同一个站点),如果满足以上条件,则上一页的流程为重用,否则,新创建一个单独的渲染进程。浏览器将向渲染进程发送“提交文档”消息。渲染进程收到消息后,会建立“管道”与网络进程传输数据。文档数据传输完成后,渲染进程会向浏览器进程返回“ConfirmSubmit”消息,浏览器收到“ConfirmSubmit”消息后,会更新浏览器的页面状态,包括安全状态,URL在地址栏中,向前和向后的历史状态,更新网页,此时的网页是一个空白页面渲染过程,对文档进行页面解析和子资源加载,HTML转换为DOM树(类似二叉树的东西)通过HTM解析器,CSS根据CSS规则和CSS解释器转换为CSSOMTREE。两棵树组合成一棵渲染树(不包括HTML的具体元素和要绘制的元素的具体位置)。通过Layout可以计算出每个元素的具体宽高、颜色位置。组合起来,开始绘图,最后显示在屏幕上。页面显示