Web前端之路计算机杂谈程序员

实现缓存的http首部字段小结

2017-11-22  本文已影响32人  _于易

核心概念:

  1. http报文分为请求报文和响应报文,结构都是报文首部+报文实体
  2. 报文首部包括四部分:请求行(响应行)+请求(响应)首部字段+通用首部字段+实体首部字段

实现缓存的首部字段有

[Expires]

存在于实体首部字段,是服务器在返回的数据上加的一个绝对时间。这东西表示数据的过期时间。用GMT格式的字符串表示,如:Expires:Thu, 31 Dec 2037 23:55:55 GMT
下次浏览器再次请求同一资源时,先从客户端缓存中寻找,找到这个资源后,拿出它的[Expires]跟当前的请求时间比较。如果请求时间在[Expires]指定的失效时间之前,就能命中缓存,这样就不用再次到服务器上去缓存一遍,节省了资源。
但是由于它是绝对时间,如果客户端时间被随意更改下,这个机制就失效了。所以我们需要[Cache-Control]。

[Cache-Control]

属于通用首部字段,用来控制缓存的,有许多参数。
比如:浏览器第一次请求a.jpg 时,服务器会发送完整的文件并附带额外信息Cache-Control: max-age=300;
浏览器会把文件和附带信息保存起来。当再次需要a.jpg 时,如果是在300秒以内发起的请求,则直接使用缓存(200, from xx cache),否则重新发起网络请求(200)。下面是Cache-Control常见的几个值:

还是有点美中不足:假如浏览器再次请求资源a.jpg的时间间隔超过了max-age,这时候向服务器发送请求服务器应该会重新返回a.jpg的完整文件。但如果 a.jpg 在服务器上未做任何修改,发送a.jpg的完整文件就太浪费带宽了,其实只要发送一个「a.jpg未被更改」的短消息标示就好了。

[Etag,If-None-Match]

这是两个首部字段,和[Cache-control]配合使用。、
比如:浏览器第一次请求a.jpg 时,服务器会发送完整的文件并附带额外信息,其中Etag 是 对a.jpg文件的编码,如果a.jpg在服务端未被修改,这个值就不会变

Cache-Control: max-age=300;
ETag:W/"e-cbxLFQW5zapn79tQwb/g6Q"

浏览器把a.jpg和额外信息保存到本地。假如浏览器在300秒以内再次需要获取a.jpg时,浏览器直接从缓存读取a.jpg(200, from xx cache)。假如浏览器在300秒之后再次需要获取a.jpg时,浏览器发现该缓存的文件已经不新鲜了,于是就向服务器发送请求 重新获取a.jpg, 在发送请求的时候附带刚刚保存的a.jpg的ETag ( If-None-Match:W/"e-cbxLFQW5zapn79tQwb/g6Q")。 服务器在接收到请求后拿浏览器请求的 Etag 和当前文件重新计算后端 Etag 做个比较,如果二者相等表示文件在未修改则发送个短消息(响应头,不包含图片内容, 304),如果二者不等则发送新文件和新的 ETag,浏览器获取新文件并更新该文件的 Etag。

与 ETag 类似功能的是[Last-Modified/If-Modified-Since]
开发人员可以设置响应实体首部字段Last-Modified 来表示资源最后一次被修改的时间。
当资源过期时(max-age超时),发现资源具有Last-Modified声明,则再次向web服务器请求时带上头 If-Modified-Since,表示请求时间。web服务器收到请求后发现有头If-Modified-Since 则与被请求资源的最后修改时间进行比对。若最后修改时间较新,说明资源又被改动过,则响应整片资源内容(200);若最后修改时间较旧,说明资源无新修改,则响应HTTP 304 ,告知浏览器继续使用所保存的cache。

上一篇 下一篇

猜你喜欢

热点阅读