在用户输入了url都发生了哪些事情:
首先url的种类有三种,
1,http://192.168.50.1:8081/index.html2,http://192.168.50.1/index.html3,http://chaxun.com浏览器在向服务器发送请求必须是:协议+ip+端口的形式(第一种的形式),如果没有端口号,浏览器会使用默认的端口号:http默认是80,https是8443,对于第三种没有ip和url的就使用到了DNS。DNS是服务是只有浏览器解析到url的服务器地址不是ip是域名的时候才会访问,就是说只有第三种情况才会开启DNS服务。DNS简单来说就是你第三种你传入的域名,我把你的域名翻译成IP地址,但是一个域名必须对应一个IP地址,一个IP地址可以有多个域名。过程就是:浏览器会首先搜索自身的DNS缓存,看看自身缓存中是否存在对应的域名,是否过期,如果没有就会搜索操作系统自身的DNS缓存,如果在系统的DNS缓存中也没有找到,那么尝试读取hosts文件,这个文件是将一些常用的网址域名与其对应的IP地址建立一个关联数据库,如果hosts文件中也没有找到,浏览器会发起一个DNS系统调用,会向本地配置的首选DNS服务器发起域名解析请求,最终拿到IP地址。当我们通过上面的方法拿到的肯定是完整的ip和端口,然后浏览器会向域名对应的IP地址发起TCP连接,就是HTTP的三次握手第一次握手:客户端发送syn包(是TCP/IP建立连接时使用的信号,客户端会发送一个SYN消息),如:客户端发送了一个SYN=j到服务器第二次握手:然后服务器会使用SYN+ACK(确认字符,表示发来的数据已确认无误)应答表示接受到了信息,如:ACK = j+1,同时服务器也会自己发送一个包到客户端 SYN = k;第三次握手:客户端收到服务器的SYN+ACK的包,再次向服务器发送确认包 ACK = K + 1;当此包发送完毕,客户端与服务端已经完成连接,已经完成三次握手。当TCP连接起来以后,浏览器就会发送HTTP请求,如第三个网址,会GET请求一个根域里的一个域名地址:chaxun.com服务端接收到了这个请求后,根据路径参数,经过后端的一些处理,把处理后的结果返回给浏览器浏览器接受HTTP相应后,检查HTTP header里的状态,404显示错误页面,304使用缓存,200下一步解码和渲染,204页面不会发生更新。。。,发起HTTP请求中携带请求头header、请求体body,header包含:1:请求方法(get、post、put等)2,协议(http、https、ftp、sftp等)3,目标url(具体的请求路径的文件名)4,一些必要的信息(缓存、cookie之类)Body包含:请求的内容当浏览器拿到index.html文件后,就开始解析其中的html代码,如果遇到JS/CSS/Image这种静态资源,就会去向服务端请求下载,然后会渲染,这些个请求还是上面的HTTP请求。当页面等静态自选加载完成后会关闭TCP连接,即四次挥手:第一次:客户端会发送FIN(希望断开链接的意思) = 1 和 ACK = a + 1 ,表示没有数据发送了,希望断开链接,如果同意就回复 ACK = a + 1;第二次:服务器收到连接释放报文(即信号),发出确认报文 ACK = a + 1,并且带上自己的序列号 SEQ = V ,这时候服务器就进入了关闭等待状态,但是这个时候是处于半关闭状态,就是说客户端已经没有数据发送,如果服务端发送数据,客户端仍然会接受第三次:当服务器将最后的数据发送完毕后,就会向客户端发送连接释放报文,FIN = 1 和 确认报文 ACK = b + 1;第四次:客户端收到报文后返回 ACK = b + 1 ;表示收到,可以断开链接 至此 服务端就会断开链接。当断开链接后,浏览器就会渲染页面,渲染的流程是:1,浏览器通过HTMLParser(HTML解析器,其本质是将HTML文本解释成DOM tree)根据深度便利原则把HTML解析成DOM Tree 2,将CSS解析成CSS Rule Tree 3,根据DOM树和CSSOM树来构造render Tree 4,根据得到的Render tree来计算所有节点在屏幕的位置。5,遍历render树,并调用硬件图形API来绘制每个节点。具体实现过程:浏览器解析HTML文档时,会完成以下步骤:1,读取HTML的原始字节,根据文件制定编码,解析为各个字符2,将字符串转化为各种标签3,将标签转化为node节点4,DOM构建,当浏览器解析时遇到link标签,会发出请求并返回资源,开始解析CSS:CSS字节转化为字符,接着转换成令牌和节点,最后构建生成CSSOM。CSSOM树和DOM树合并成渲染树(render Tree)然后用于计算每个可见元素的布局,并输出给绘制流程,将像素渲染到屏幕上,构建渲染树的步骤:1,从DOM树的根节点开始遍历每个可见节点2,对于每个可见节点,为其找到适配的CSSOM规则并应用它 3,生成渲染树 布局阶段:输出盒模型 绘制:输出到屏幕上的像素