1,使用DNS域名解析:
1)首先会搜索浏览器自身的DNS缓存(缓存时间比较短,大概只有1分钟,且只能容纳1000条缓存)
2)如果浏览器自身的缓存里面没有找到,那么浏览器会搜索系统自身的DNS缓存
3)如果还没有找到,那么尝试从 hosts文件里面去找
4)在前面三个过程都没获取到的情况下,就递归地去域名服务器去查找,
2,TCP连接,开启的三次握手,和关闭的四次挥手
三次握手:所谓的三次握手即TCP连接的建立。这个连接必须是一方主动打开,另一方被动打开的。
步骤:1)建立连接时,客户端发送包到服务器;2)服务器收到包,同时自己发送一个包给客户端;3)客户端收到服务器的包,并向服务器发送确认包
为啥要进行三次握手:为了防止服务器端开启一些无用的连接增加服务器开销以及防止已失效的连接请求报文段突然又传送到了服务端,因而产生错误。由于网络传输是有延时的(要通过网络光纤和各种中间代理服务器),在传输的过程中,比如客户端发起了SYN=1创建连接的请求(第一次握手)。如果服务器端就直接创建了这个连接并返回包含SYN、ACK和Seq等内容的数据包给客户端,这个数据包因为网络传输的原因丢失了,丢失之后客户端就一直没有接收到服务器返回的数据包。客户端可能设置了一个超时时间,时间到了就关闭了连接创建的请求。再重新发出创建连接的请求,而服务器端是不知道的,如果没有第三次握手告诉服务器端客户端收的到服务器端传输的数据的话,服务器端是不知道客户端有没有接收到服务器端返回的信息的。
第三次握手的意义:让客户端和服务器端能够及时地察觉到因为网络等一些问题导致的连接创建失败,这样服务器端的端口就可以关闭了不用一直等待。“第三次握手”是客户端向服务器端发送数据,这个数据就是要告诉服务器,客户端有没有收到服务器“第二次握手”时传过去的数据。若发送的这个数据是“收到了”的信息,接收后服务器就正常建立TCP连接,否则建立TCP连接失败,服务器关闭连接端口。由此减少服务器开销和接收到失效请求发生的错误。
四次挥手:所谓的四次挥手即TCP连接的释放(解除)。连接的释放必须是一方主动释放,另一方被动释放。
步骤:1)客户端想要释放连接,向服务器端发送一段TCP报文;2)服务器端接收到从客户端发出的TCP报文之后,确认了客户端想要释放连接,随后服务器端结束ESTABLISHED阶段,进入CLOSE-WAIT阶段(半关闭状态)并返回一段TCP报文;3)服务器端自从发出ACK确认报文之后,经过CLOSED-WAIT阶段,做好了释放服务器端到客户端方向上的连接准备,再次向客户端发出一段TCP报文;4)客户端收到从服务器端发出的TCP报文,确认了服务器端已做好释放连接的准备,结束FIN-WAIT-2阶段,进入TIME-WAIT阶段,并向服务器端发送一段报文
为啥需要三次握手,挥手却要四次:建立连接时,被动方服务器端结束CLOSED阶段进入“握手”阶段并不需要任何准备,可以直接返回SYN和ACK报文,开始建立连接。释放连接时,被动方服务器,突然收到主动方客户端释放连接的请求时并不能立即释放连接,因为还有必要的数据需要处理,所以服务器先返回ACK确认收到报文,经过CLOSE-WAIT阶段准备好释放连接之后,才能返回FIN释放连接报文。
3,发起http请求
1)HTTP请求报文由三部分组成:请求行,请求头和请求正文
2)请求行:用于描述客户端的请求方式,请求的资源名称以及使用的HTTP协议的版本号
3)请求头:用于描述客户端请求哪台主机,以及客户端的一些环境信息等
4)请求正文:当使用POST, PUT等方法时,通常需要客户端向服务器传递数据。这些数据就储存在请求正文中(GET方式是保存在url地址后面,不会放到这里)
5)这里提一个请求头 Connection,Connection设置为 keep-alive用于说明 客户端这边设置的是,本次HTTP请求之后并不需要关闭TCP连接,这样可以使下次HTTP请求使用相同的TCP通道,节省TCP建立连接的时间
4,服务器端响应http请求,浏览器得到html代码
1)HTTP响应也由三部分组成:状态码,响应头和实体内容
2)状态码:状态码用于表示服务器对请求的处理结果
1**:信息,服务器收到请求,需要请求者继续执行操作;200:请求成功;3**:重定向;4**:客户端错误;5**:服务器错误
常用:200:请求成功;304:资源未修改,不会返回任何资源;400:客户端请求的语法错误;401:请求要求用户的身份认证;403:服务器拒绝此请求;404:服务器无法根据客户端的请求找到资源;500:服务器内部错误;502:网关错误;503:由于超载或系统维护,服务器暂时的无法处理客户端的请求
3)响应头:响应头用于描述服务器的基本信息,以及客户端如何处理数据
4)实体内容:服务器返回给客户端的数据
5,浏览器解析html代码,并请求html代码中的资源
浏览器拿到html文件后,就开始解析其中的html代码,遇到js/css/image等静态资源时,就向服务器端去请求下载(会使用多线程下载,每个浏览器的线程数不一样),这是时候就用上 keep-alive特性了,建立一次HTTP连接,可以请求多个资源,下载资源的顺序就是按照代码里面的顺序,但是由于每个资源大小不一样,而浏览器又是多线程请求请求资源,所以这里显示的顺序并不一定是代码里面的顺序。
6,浏览器对页面进行渲染呈现给用户
1)浏览器是一个边解析边渲染的过程。首先浏览器解析HTML文件构建DOM树,然后解析CSS文件构建渲染树,等到渲染树构建完成后,浏览器开始布局渲染树并将其绘制到屏幕上。这个过程比较复杂,涉及到两个概念: reflow(回流)和repain(重绘)。DOM节点中的各个元素都是以盒模型的形式存在,这些都需要浏览器去计算其位置和大小等,这个过程称为reflow;当盒模型的位置,大小以及其他属性,如颜色,字体,等确定下来之后,浏览器便开始绘制内容,这个过程称为repain。页面在首次加载时必然会经历reflow和repain。reflow和repain过程是非常消耗性能的,尤其是在移动设备上,它会破坏用户体验,有时会造成页面卡顿。所以我们应该尽可能少的减少reflow和repain。
2)JS的解析是由浏览器中的JS解析引擎完成的。JS是单线程运行,JS有可能修改DOM结构,意味着JS执行完成前,后续所有资源的下载是没有必要的,所以JS是单线程,会阻塞后续资源下载