浏览器缓存机制

概念

浏览器会将请求后的资源进行存贮为离线资源，当下次需要该资源时，浏览器会根据缓存机制决定直接使用缓存资源还是再次向服务器发送请求

作用

• 减少了不必要数据的传输、降低服务器的压力
• 加快了客户端访问速度
• 增强用户体验

强缓存

不向服务端发送请求，强制使用缓存数据

实现方式

后端在响应头中返回 Expires 和 Cache-Control

Expires ：

http 协议 1.0 的字端

缓存过期时间，用来指定资源到期的时间，是服务器端的具体的时间点

浏览器：使用 expires 到期时间和本地时间进行对比，如果本地时间被修改或者和服务器时间差距较大，造成不准确的问题

Cache-Control

Cache-Control 是 HTTP 1.1 的字段

约定过期时间的相对时间

当 cache-control 和 expires 同时存在 cache-control 的优先级会比 expires 高

协商缓存

当强缓存失效后，会使用协商缓存

协商缓存由服务器决定是否使用缓存

1. 向服务器发送请求资源并携带标识

   Etag 字段：表示请求资源在服务器的唯一标识，浏览器可以根据 ETag 值缓存数据，下次请求的时候以 If-None-Match 字段请求

   Last-Modified 字段：用于标记请求资源的最后一次修改时间

2. 服务器会进行判断浏览器缓存的资源是否真的失效是否更新

   真的失效，服务端已经更新，返回 200，重新返回最新资源和缓存标识

   浏览器再次存入缓存

   后续再次从强缓存开始

3. 缓存时间到了，但是资源没更新，就还使用本地的

   直接返回 304

总结

后续再次从强缓存开始

3. 缓存时间到了，但是资源没更新，就还使用本地的

   直接返回 304

总结