web缓存分为很多种:
- 数据库缓存
- 服务器缓存(代理缓存)
- CDN缓存
- 浏览器缓存
浏览器缓存的好处:
- 使网页加载和呈现速度更快。
- 减少非必要的数据传输,进而节省网络流量和带宽。
- 在上一步的基础上,服务器的负担因此减少。
浏览器缓存(按策略分类)主要有两类:
缓存协商:Last-modified ,Etag 。
彻底缓存(强缓存):cache-control,Expires。
强缓存与协商缓存的区别
强缓存:是指客户端在第一次请求后,有效时间内不会再去请求服务器,而是直接使用缓存数据。
协商缓存:是指客户端在请求后,有效时间内在本地缓存数据中找到并没有直接使用,会向服务器请求验证资源是否更新,服务器返回未更改的(304)信号,如果没有更新才会继续使用本地缓存,此时这个304信号就是协商缓存。
强缓存的分类
强缓存主要包括:expires和cache-control。
1.expires
expires 是 HTTP1.0 中定义的缓存字段。当我们请求一个资源,服务器返回时,可以在 Response Headers 中增加 expires 字段表示资源的过期时间
expires: Thu, 03 Jan 2019 11:43:04 GMT
它是一个时间戳(准确点应该叫格林尼治时间),当客户端再次请求该资源的时候,会把客户端时间与该时间戳进行对比,如果大于该时间戳则已过期,否则直接使用该缓存资源。
但是,有个大问题,发送请求时是使用的客户端时间去对比。一是客户端和服务端时间可能快慢不一致,另一方面是客户端的时间是可以自行修改的(比如浏览器是跟随系统时间的,修改系统时间会影响到),所以不一定满足预期。
2.cache-control
正由于上面说的可能存在的问题,HTTP1.1 新增了 cache-control 字段来解决该问题,所以当 cache-control 和 expires 都存在时,cache-control 优先级更高。该字段是一个时间长度,单位秒,表示该资源过了多少秒后失效。当客户端请求资源的时候,发现该资源还在有效时间内则使用该缓存,它不依赖客户端时间。cache-control 主要有 max-age 和 s-maxage、public 和 private、no-cache 和 no-store 等值。
cache-control: public, max-age=3600, s-maxage=3600
1.max-age 和 s-maxage
两者是 cache-control 的主要字段,它们是一个数字,表示资源过了多少秒之后变为无效。在浏览器中,max-age 和 s-maxage 都起作用,而且 s-maxage 的优先级高于 max-age。在代理服务器中,只有 s-maxage 起作用。 可以通过设置 max-age 为 0 表示立马过期来向服务器请求资源。
2.public 和 private
public 表示该资源可以被所有客户端和代理服务器缓存,而 private 表示该资源仅能客户端缓存。默认值是 private,当设置了 s-maxage 的时候表示允许代理服务器缓存,相当于 public。
3.no-cache 和 no-store
no-cache 表示的是不直接询问浏览器缓存情况,而是去向服务器验证当前资源是否更新(即协商缓存)。no-store 则更狠,完全不使用缓存策略,不缓存请求或响应的任何内容,直接向服务器请求最新。由于两者都不考虑缓存情况而是直接与服务器交互,所以当 no-cache 和 no-store 存在时会直接忽略 max-age 等。
协商缓存主要包括:last-modified和etag
1.last-modified
last-modified 记录资源最后修改的时间。启用后,请求资源之后的响应头会增加一个 last-modified 字段
last-modified: Thu, 20 Dec 2018 11:36:00 GMT
last-modified 有以下两个缺点:
- 只要编辑了,不管内容是否真的有改变,都会以这最后修改的时间作为判断依据,当成新资源返回,从而导致了没必要的请求响应,而这正是缓存本来的作用即避免没必要的请求。
- 时间的精确度只能到秒,如果在一秒内的修改是检测不到更新的,仍会告知浏览器使用旧的缓存。
2.etag
为了解决 last-modified 上述问题,有了 etag。 etag 会基于资源的内容编码生成一串唯一的标识字符串,只要内容不同,就会生成不同的 etag。启用 etag 之后,请求资源后的响应返回会增加一个 etag 字段
etag: "FllOiaIvA1f-ftHGziLgMIMVkVw_"
流程图
咱们对强缓存与协商缓存进行一个优先级的总结:
如下图所示:优先级顺序为cache-control>expires>etag>last-modified