HTTP协议总结

主要是对阅读《图解 http》后的自己的一些总结,其中省略了不少我认为不重要或者没有理解的部分。在以后知识面拓宽后进行修正和补漏。

首先是 HTTP 协议脑图

image

其它

从输入 url 到页面展示发生了什么

一道很常见的面试题目,能方便我们复习 HTTP 中的内容,根据上面的脑图和其它资料很容易就能解答。

查找域名 IP

发生在 TCP/IP 协议的应用层。由 DNS 协议相关。

  1. 浏览器首先搜索自己的 DNS 缓存
  2. 搜索系统的 hosts 文件
  3. 搜索路由器的 DNS 缓存
  4. 搜索服务商 DNS 缓存,如果没有,则向跟域名服务器发送查找请求,直到找到 IP 地址。

HTTP 请求发起

HTTP 的请求报文包括报文首部和报文主体。

报文首部又包括:

  1. 请求行
  2. 请求首部
  3. 通用首部
  4. 实体首部

常见的请求首部

Accept: text/html,image/*                                      #浏览器可以接收的类型
Accept-Charset: ISO-8859-1                                     #浏览器可以接收的编码类型
Accept-Encoding: gzip,compress                                 #浏览器可以接收压缩编码类型
Accept-Language: en-us,zh-cn                                   #浏览器可以接收的语言和国家类型
Host: www.lks.cn:80                                            #浏览器请求的主机和端口
If-Modified-Since: Tue, 11 Jul 2000 18:23:51 GMT               #某个页面缓存时间
Referer: http://www.lks.cn/index.html                          #请求来自于哪个页面
User-Agent: Mozilla/4.0 compatible; MSIE 5.5; Windows NT 5.0   #浏览器相关信息
Cookie:                                                        #浏览器暂存服务器发送的信息
Connection: close1.0/Keep-Alive1.1                             #HTTP请求的版本的特点
Date: Tue, 11 Jul 2000 18:23:51GMT                             #请求网站的时间
Allow:GET                                                      #请求的方法 GET 常见的还有POST
Keep-Alive:5                                                   #连接的时间;5
Connection:keep-alive                                          #是否是长连接
Cache-Control:max-age=300                                      #缓存的最长时间 300s

下面主要说下缓存规则

HTTP 缓存

HTTP 缓存根据是否需要重新向服务器发起请求分为强制缓存和对比缓存两大类,强制缓存如果生效,不需要再和服务器发生交互;对比缓存不管是否生效,都需要和服务器发生交互。

两类缓存规则可以同时存在,强制缓存优先级高于对比缓存。当强制缓存执行时不再执行对比缓存规则。

强制缓存

Expires/Cache-control 标明失效规则,在客户端第一次请求,服务器把数据返回后,浏览器将数据缓存。

Expire 的值表示了缓存的到期时间,是 HTTP1.0 的东西,所以它的作用基本忽略。Expire 的缺点是返回的到期时间是服务器的时间,而比较的时间是客户端本地时间,可能会导致差错。

Cache-Control 用于定义缓存指示,会覆盖 Expires,包括 public,private,no-cache,no-store、max-age、s-maxage 以及 must-revalidate 等

对比缓存

对比缓存需要进行比较判断是否可以使用缓存。

在浏览器第一次请求数据时,服务器会将缓存标识与数据一起返回客户端。再次请求时,客户端将缓存标识发给服务器,服务器根据标识进行判断,如果缓存生效则返回 304;且只返回 header 部分。

Last-Modified:服务器在响应请求时返回的资源最后修改时间。

If-Modified-Since:再次请求服务器时,通过此字段通知服务器上次请求时,服务器返回的资源最后修改时间。

服务器收到请求后发现有头 If-Modified-Since 则与被请求资源的最后修改时间进行比对。若资源的最后修改时间大于 If-Modified-Since,说明资源又被改动过,则响应整片资源内容,返回状态码 200;
若资源的最后修改时间小于或等于 If-Modified-Since,说明资源无新修改,则响应 HTTP 304,告知浏览器继续使用所保存的 cache。

Last-Modified 标注的最后修改时间只能精确到秒,如果有些资源在一秒之内被多次修改的话,他就不能准确标注文件的新鲜度了如果某些资源会被定期生成,当内容没有变化,但 Last-Modified 却改变了,导致文件没使用缓存有。可能存在服务器没有准确获取资源修改时间,或者与代理服务器时间不一致的情形。

Etag/If-None-Match 规则(优先级高于 Last-Modified/If-Modified-Since)

Etag:
服务器资源的唯一标识符, 浏览器可以根据 ETag 值缓存数据, 节省带宽. 如果资源已经改变, etag 可以帮助防止同步更新资源的相互覆盖. ETag 优先级比 Last-Modified 高.

If-None-Match:
再次请求服务器时,通过此字段通知服务器客户段缓存数据的唯一标识。

服务器收到请求后发现有头 If-None-Match 则与被请求资源的唯一标识进行比对,
不同,说明资源又被改动过,则响应整片资源内容,返回状态码 200;
相同,说明资源无新修改,则响应 HTTP 304,告知浏览器继续使用所保存的 cache。

不能缓存的请求

HTTP 信息头中包含 Cache-Control:no-cache,pragma:no-cache,或 Cache-Control:max-age=0 等告诉浏览器不用缓存的请求

需要根据 Cookie,认证信息等决定输入内容的动态请求是不能被缓存的

经过 HTTPS 安全加密的请求

HTTP 响应头中不包含 Last-Modified/Etag,也不包含 Cache-Control/Expires 的请求无法被缓存

POST 请求

传输层 TCP 传输报文

位于传输层的 TCP 协议为传输报文提供可靠的字节流服务。它为了方便传输,将大块的数据分割成以报文段为单位的数据包进行管理,并为它们编号,方便服务器接收时能准确地还原报文信息。TCP 协议通过“三次握手”等方法保证传输的安全可靠。

“三次握手”的过程是,发送端先发送一个带有 SYN(synchronize)标志的数据包给接收端,在一定的延迟时间内等待接收的回复。接收端收到数据包后,传回一个带有 SYN/ACK 标志的数据包以示传达确认信息。接收方收到后再发送一个带有 ACK 标志的数据包给接收端以示握手成功。在这个过程中,如果发送端在规定延迟时间内没有收到回复则默认接收方没有收到请求,而再次发送,直到收到回复为止。

网络层 IP 协议查询 MAC 地址

IP 协议的作用是把 TCP 分割好的各种数据包传送给接收方。而要保证确实能传到接收方还需要接收方的 MAC 地址,也就是物理地址。IP 地址和 MAC 地址是一一对应的关系,一个网络设备的 IP 地址可以更换,但是 MAC 地址一般是固定不变的。ARP 协议可以将 IP 地址解析成对应的 MAC 地址。当通信的双方不在同一个局域网时,需要多次中转才能到达最终的目标,在中转的过程中需要通过下一个中转站的 MAC 地址来搜索下一个中转目标。

数据到达数据链路层

在找到对方的 MAC 地址后,就将数据发送到数据链路层传输。这时,客户端发送请求的阶段结束

服务器响应请求

服务接收到客户端发送的 HTTP 请求后,查找客户端请求的资源,并返回响应报文

服务器返回相应文件,页面渲染

现代浏览器渲染页面的过程是这样的:jiexiHTML 以构建 DOM 树 –> 构建渲染树 –> 布局渲染树 –> 绘制渲染树。

DOM 树是由 HTML 文件中的标签排列组成,渲染树是在 DOM 树中加入 CSS 或 HTML 中的 style 样式而形成。渲染树只包含需要显示在页面中的 DOM 元素,像元素或 display 属性值为 none 的元素都不在渲染树中。

在浏览器还没接收到完整的 HTML 文件时,它就开始渲染页面了,在遇到外部链入的脚本标签或样式标签或图片时,会再次发送 HTTP 请求重复上述的步骤。在收到 CSS 文件后会对已经渲染的页面重新渲染,加入它们应有的样式,图片文件加载完立刻显示在相应位置。在这一过程中可能会触发页面的重绘或重排。