http缓存机制
2020-10-16 本文已影响0人
灯下草虫鸣314
前言
本文是阅读文章所做笔记。意在加深记忆也便于日后查找
强缓存和协商缓存
http的缓存机制可以分为两种类型:
- 强缓存:浏览器判断本地缓存未过期,就直接使用,无需发起http请求
- 协商缓存: 浏览器判断本地缓存过期,发送http请求,服务器返回304告诉浏览器文件未改变,浏览器继续使用本地缓存
缓存头部
如何区分缓存类型呢?主要根据http头部字段
属于强缓存控制:
- http1.0:
Pragma
/Expires
- http1.1:
Cache-Control
/Max-Age
ps:Max-Age
不是一个头部,而是Cache-Control
的值
属于协商缓存控制:
- http1.0:
If-Modified-Since
/Last-Modified
- http1.1:
If-None-Match
/E-tag
http1.0和http1.1缓存头部控制的区别
在http1.0中:
-
Pragma
: 严格说,他不属于专门控制缓存的头部,但是当其值为no-cache
时可以让本地强缓存失效 -
Expires
: 在服务端配置,用于强缓存。用来控制在规定时间之前,浏览器不需要在发出请求,直接使用本地缓存。切Expires是服务端时间 -
If-Modified-Since
/Last-Modified
: 这两个是成对出现。属于协商缓存。其中浏览器端头部为If-Modified-Since
,服务器端为Last-Modified
。在发送请求时,如果If-Modified-Since
和Last-Modified
匹配,那么表示服务器资源为变化,服务器不会返回当前资源。而是返回头部,告知浏览器使用本地缓存。Last-Modified
是指文件的最后修改时间。只能精确到1s以内。
在http1.1中:
-
Cache-Control
:缓存控制的头部。有no-cache, max-age,no-store等值。 -
Max-Age
:服务器端配置,用于强缓存,例如Cache-Control=max-age=3600
在3600秒内,浏览器无需再次发出请求直接使用本地缓存。他的值是绝对时间,由浏览器自己计算。 -
If-None-Match
/E-tag
: 这个是成对出现的。属于协商缓存。其中浏览器端头部为If-None-Match
,服务器端为E-tag
。当浏览器发出请求后两者匹配,则表示服务器端资源未改变,服务器不会返回资源本身,返回头部,浏览器使用本地缓存。和Last-Modified
相比。E-tag
更精确。没有1s的误差。
Max-Age 和 Expires 区别
Expires
使用的服务器时间。当服务器时间和浏览器时间不同步时,可能会发生缓存无效或一直无法过期的bug。
而E-tag
使用的浏览器时间。就不会存在上述问题。
E-tag 和 Last-Modified 区别
Last-Modified
表示的是文件的最后修改时间,有一个精确1s的缺陷,如果服务端的文件周期性改变,会导致缓存失效。
而E-tag
是一种指纹机制。只有文件发生改变才会变化。不存在1s的缺陷。
缓存关系图
缓存关系图