http 缓存 Better

什么是缓存

客户端初次请求某个资源,如果下次再访问时,这个资源(js,css,图片,字体文件...)没必要重新获取,就将它存在本地。

为什么需要缓存

让页面加载的更快。
相比于CPU的运算、页面的渲染,网络请求资源(网络请求速度慢,网络有不稳定性)是很慢的。将不需要每次都重新请求的资源缓存,减少网络请求次数,提升页面加载速度。

哪些资源可以被缓存

可以缓存: 静态资源 js、 css、 image
不可以缓存: html 、业务数据

强制缓存

客户端返回资源,同时在Response Headers中,加 Cache-Control: max-age=xxxxxx (单位:秒)
Cache-Control 的值

  • max-age=xxx 设置过期时间
  • no-cache 再次请求时,带上指纹(etag)找服务端验证
  • no-store 再次请求,不带指纹,让服务器重新发送资源
  • private 只给最终用户做缓存??
  • public 中间的路由、代理也可以做缓存??
    expires
  • 同在Response Headers中
  • 同为控制缓存过期
  • 已被 Cache-Control代替

协商缓存

缓存直接可用,还是要更新,需要和服务端进行协商的一种缓存策略。
缓存资源与客户端:

  • 一致 返回304
  • 不一致 返回 200 和 最新的资源

资源标识
Response Headers中,有两种:(会优先使用 Etag,因为 Last-Modified 只能精确到秒,资源内容不变但重新生成也会更新)

  • Last-Modified 资源最后修改时间
    再次请求时,带到Request Headers If-Modified-Since

  • Etag 资源的唯一标识(指纹)
    再次请求时,带到Request Headers If-None-Match

总结

image

参考资料

图解缓存:https://zhuanlan.zhihu.com/p/55623075

原文地址:https://www.cnblogs.com/huangtq/p/14656363.html