综述:浏览器缓存机制对于前端工程师来说十分重要,使用缓存会极大提高页面性能,减少请求
1.浏览器对于请求资源, 拥有一系列成熟的缓存策略. 按照发生的时间顺序分别为存储策略, 过 期策略, 协商策略, 其中存储策略在收到响应后应用, 过期策略, 协商策略在发送请求前应用. 流程图 如下所示:
2.缓存策略分类
key | 描述 | 存储策略 | 过期策略 | 协商策略 |
Cache-control | 指定缓存机制,覆盖其他设置 | 是 | 是 | |
Pragmat | http1.0字段,指定缓存机制 | 是 | ||
Expires | http1.0字段,指定缓存过期的时间 | 是 | ||
Last-Modified | 资源最后一次的修改时间 | 是 | ||
ETag | 唯一标识请求资源的字符串 | 是 |
3.http header中与缓存有关的key
key | 描述 |
If-Modified-Since | 缓存校验字段,值为资源最后一次的修改时间,继上次收到的Last-Modified值 |
If-Unmodified-Since | 同上,处理方式与之相反 |
If-Match | 缓存校验字段,值为唯一标识请求资源的字符串,即上次收到的ETag值 |
If-None-Match | 同上,处理方式与之相反 |
4.缓存协商策略用于重新验证缓存资源是否有效,有关的Key如下:
下面我们看看哥哥头域(key)的作用:
-
Cache-Control-浏览器缓存里,是金字塔顶尖的规则,它藐视一切其他设置,只要其他设置与其抵触,一律覆盖;
-
不仅如此,他还是一个符合规则,包含多种值,横跨存储策略,过期策略两种,同时在请求头和响应头都可设置,语法为:
“Cache-Control : cache-directive”
5.ETag的作用?
参考链接:https://www.cnblogs.com/shixiaomiao1122/p/7591556.html
6.怎样修改http中的以上参数,达到控制缓存的目的?参考文章如下;这里的设置在后端的配置文件中进行的;设置相应的文件资源的过期时间;
https://www.cnblogs.com/ae6623/p/5319816.html