缓存的存储

浏览器缓存分为三种, 下面按查找优先级列出

  1. Service Worker: 目前完全没接触, 先不管了, 大致感觉就是一个可由用户完全控制的缓存.
  2. Memory Cache: 内存缓存, 具体怎么存, 存哪里由浏览器控制, 用户只能制定策略(存多久, 多久失效等)
  3. Disk Cache: 硬盘缓存, 因为是持久化的, 所以关了tab或者浏览器重开后也能获取到.

当执行一条请求时, 会先按照上述顺序查询各级缓存, 如果查不到, 就会实际去服务器获取.

注意一下, 缓存针对的是get请求, 毕竟put/delete/update也不是用于获取文件的 (平时html里里引用的js/css实际也是通过get请求获取到的)

响应头与缓存策略

当get请求获取到一个文件时, 响应头response header会指明该文件的缓存策略, 通过两个选项指明

  1. Expires
  2. Cache-control

注意这两个字段用于设置缓存策略, 但是还会有一些配套的字段用于记录相关信息

实际效果如下图所示

http://media-1252931790.cosgz.myqcloud.com/20201110155315.png

Expires

Expires是HTTP1.0中的定义的响应头, 具体用法很简单

Expires: Tue, 10 Nov 2020 07:58:42 GMT

指明该文件的过期时间是2020年11月10号 7点58分42秒, 但是有两个缺点

  1. 格式严格, 少个空格都不行, 会导致策略失效
  2. 时间是以浏览器时间为准, 如果服务器时间和浏览器时间不一致, 缓存策略可能不符合预期. 比如期望是缓存5秒, 但是浏览器时间比服务器快10秒, 导致缓存永远也不生效.