这是我参与「第五届青训营」伴学笔记创作活动的第 6 天

HTTP重点知识复习

浏览器中输入url后发生了什么

该过程可以分为以下六步：

DNS域名解析=>建立TCP连接=>发起HTTP请求=>接受响应结果=>浏览器解析html=>浏览器布局渲染

DNS域名解析
在浏览器DNS缓存中搜索
在操作系统DNS缓存中搜索
读取系统hosts文件，查找其中是否有对应的ip
向本地配置的首选DNS服务器发起域名解析请求
建立TCP连接
为了准确地传输数据，TCP协议采用了三次握手策略。发送端首先发送一个带SYN（synchronize）标志的数据包给接收方，接收方收到后，回传一个带有SYN/ACK(acknowledegment)标志的数据包以示传达确认信息。最后发送方再回传一个带ACK标志的数据包，代表握手结束。在这过程中若出现问题中断，TCP会再次发送相同的数据包。
TCP是一个端到端的可靠的面向连接的协议，所以HTTP基于传输层TCP协议不用担心数据的传输的各种问题。
发起HTTP请求

GET:获取资源
POST:传输实体主体
HEAD:获取报文首部
PUT:传输文件
DELETE:删除文件
OPTIONS:询问支持的方法
TRACE:追踪路径

请求报文：

4. 接受响应结果

1**：信息性状态码
2**：成功状态码
200：OK 请求正常处理
204：No Content请求处理成功，但没有资源可返回
206：Partial Content对资源的某一部分的请求
3**：重定向状态码
301：Moved Permanently 永久重定向
302：Found 临时性重定向
304：Not Modified 缓存中读取
4**：客户端错误状态码
400：Bad Request 请求报文中存在语法错误
401：Unauthorized需要有通过Http认证的认证信息
403：Forbidden访问被拒绝
404：Not Found无法找到请求资源
5**：服务器错误状态码
500：Internal Server Error 服务器端在执行时发生错误
503：Service Unavailable 服务器处于超负载或者正在进行停机维护

响应报文：

5. 浏览器解析html
浏览器按顺序解析html文件，构建DOM树，在解析到外部的css和js文件时，向服务器发起请求下载资源，若是下载css文件，则解析器会在下载的同时继续解析后面的html来构建DOM树，则在下载js文件和执行它时，解析器会停止对html的解析。这便出现了js阻塞问题。
预加载器：
当浏览器被脚本文件阻塞时，预加载器（一个轻量级的解析器）会继续解析后面的html，寻找需要下载的资源。如果发现有需要下载的资源，预加载器在开始接收这些资源。预加载器只能检索HTML标签中的URL，无法检测到使用脚本添加的URL，这些资源要等脚本代码执行时才会获取。
注: 预解析并不改变Dom树，它将这个工作留给主解析过程

浏览器解析css，形成CSSOM树，当DOM树构建完成后，浏览器引擎通过DOM树和CSSOM树构造出渲染树。渲染树中包含可视节点的样式信息（不可见节点将不会被添加到渲染树中，如：head元素和display值为none的元素）

值得注意的是，这个过程是逐步完成的，为了更好的用户体验，渲染引擎将会尽可能早的将内容呈现到屏幕上，并不会等到所有的html都解析完成之后再去构建和布局render树。它是解析完一部分内容就显示一部分内容，同时，可能还在通过网络下载其余内容。

浏览器布局渲染
布局：通过计算得到每个渲染对象在可视区域中的具体位置信息（大小和位置），这是一个递归的过程。
绘制：将计算好的每个像素点信息绘制在屏幕上
在页面显示的过程中会多次进行Reflow和Repaint操作，而Reflow的成本比Repaint的成本高得多的多。因为Repaint只是将某个部分进行重新绘制而不用改变页面的布局，如：改变了某个元素的背景颜色。而如果将元素的display属性由block改为none则需要Reflow。

减少rpaint和reflow 方法

常见的HTTP状态码

类别	原因短语
1XX Informational（信息性状态码）	接受的请求正在处理
2XX Success（成功状态码）	请求正常处理完毕
3XX Redirection（重定向状态码）	需要进行附加操作以完成请求
4XX Client Error（客户端错误状态码）	服务器无法处理请求
5XX Server Error（服务器错误状态码）	服务器处理请求出错

1xx:提示信息-表示请求已被接受，继续处理。

100 客户必须继续发出请求；
101 客户要求服务器根据请求转换HTTP协议版本。

2xx:成功-表示请求已被成功接受、理解、接受

200 OK（成功）服务器已成功处理了请求。通常，这表示服务器提供了请求的网页；
201（已创建）请求成功并且服务器创建了新的资源；
202（已接受）服务器已接收请求，但尚未处理。

3xx:重定向-要完成请求必须进行更进一步的操作

300（多种选择）针对请求，服务器可执行多种操作。服务器可根据请求者选取一项操作，或者提供操作列表供请求者选择；
301 Moved Permanently（永久移动-重定向）请求的网站已永久移动到新位置服务器返回此响应（对GET、HEAD请求的响应），自动转移到新位置；
302 Found（临时移动-重定向）服务器目前从不同位置的网页响应请求，但请求者继续使用原位置进行请求；
303 See Other：表示请求的资源被分配了新的URL，应使用GET方法定向获取请求的资源；
302与303的区别：后者明确表示客户端应当采用GET方式获取资源
304 Not Modified：表示客户端发送附带条件（是指采用GET方法的请求报文中包含if-Match、If-Modified-Since、If-None-Match、If-Range、If-Unmodified-Since中任一首部）的请求时，服务器端允许访问资源，但是请求为满足条件的情况下返回改状态码；
307 Temporary Redirect：临时重定向，与303有着相同的含义，307会遵照浏览器标准不会从POST变成GET；（不同浏览器可能会出现不同的情况）。

4xx:客户端错误-请求有语法错误或请求无法实现

400 Bad Request（错误请求）服务器不理解请求的语法；
401 Unauthorized（未授权）发送的请求需要有通过HTTP认证（BASIC认证，DIGEST认证）的认证信息。请求要求身份验证。如需要登陆的网页。
403 Forbidden（禁止）服务器拒绝请求，对请求资源的访问被服务器拒绝了，（权限，未授权IP等）；
404 Not Found （未找到）：服务器上没有请求的资源。路径错误等，也可以在服务器拒绝请求但不想给拒绝原因时使用。

5xx:服务器端错误-服务器未能实现合法的请求

500 Internal Server Error（服务器内部错误）服务器遇到错误，无法完成请求，服务器端在执行请求时发生了错误。也有可能是web应用存在bug或某些临时故障；
501 （尚未实施）服务器不具备完成请求的功能。例如服务器无法识别请求方法；
502 （错误网关）服务器作为网关或者代理，从上游服务器收到无效响应；
503 Service Unavailable（服务不可用）服务器目前无法使用（由于超载或者停机维护），现在无法处理请求，通常只是暂时状态；
504（网关超时）服务器作为网关或者代理，但是没有及时从上游服务器收到请求；
505（HTTP版本不支持）服务器不支持请求中所使用的HTTP协议版本。

1**：信息性状态码
2**：成功状态码
200：OK 请求正常处理
204：No Content请求处理成功，但没有资源可返回
206：Partial Content对资源的某一部分的请求
3**：重定向状态码
301：Moved Permanently 永久重定向
302：Found 临时性重定向
304：Not Modified 缓存中读取
4**：客户端错误状态码
400：Bad Request 请求报文中存在语法错误
401：Unauthorized需要有通过Http认证的认证信息
403：Forbidden访问被拒绝
404：Not Found无法找到请求资源
5**：服务器错误状态码
500：Internal Server Error 服务器端在执行时发生错误
503：Service Unavailable 服务器处于超负载或者正在进行停机维护

HTTP重点知识复习 | 青训营笔记 第 6 天