HTTP缓存看这一篇就够了 _HTTP

通过前文，我们了解到 HTTP 缓存主要分：强制缓存、协商缓存。强制缓存由Exipres（HTTP/1.0）、 Cache-Control（HTTP/1.1）控制。客户端直接读本地缓存，不会再跟服务器端交互，状态码 200 。?前言HTTP缓存机制是优化web性能的重要手段，也是优化用户体验的重要一环。了解和熟悉HTTP缓存机制也成为了前端工作者必不可少的技能。
HTTP缓存是用于临时存储网页资源（如html页面、图像等），以减少服务器延迟的一种技术。HTTP缓存系统会保存下通过这套系统的文档的副本；如果满足某些条件，则可以由缓存满足后续请求。HTTP缓存系统既可以指设备，也可以指计算机程序。
一、HTTP缓存的类别HTTP缓存可分为强制缓存和协商缓存。
强制缓存：直接使用客户端缓存，不从服务器拉取新资源，也不验证缓存资源是否过期。返回的状态码为200（OK）。
协商缓存：通过服务器验证资源有效性，资源有效则返回304（Not Modified），资源失效则返回最新的资源文件。
HTTP主流的有三个版本：HTTP/1.0、HTTP/1.1、HTTP/2.0 。其中HTTP/1.0和HTTP/1.1的应用最为广泛。HTTP/2.0因对缓存机制的改动有别于HTTP/1.0和HTTP/1.1，因此HTTP/2.0相关内容会在文末总结部分进行介绍。HTTP/1.0与HTTP/1.1可根据缓存类别区分如下：
HTTP版本
强制缓存
协商缓存
HTTP/1.0
Expires
Last-Modified
HTTP/1.1
Cache-Control
ETag
二、主流的HTTP缓存参数2.1 强制缓存2.1.1 HTTP/1.0 - ExpiresExpires?的值为服务端返回的到期时间，是一个GMT?（格林尼治标准时间）绝对时间，如：Tue, 17 Jan 2023 03:48:45 GMT? 。下一次请求时，客户端判断当前系统GMT?时间是否小于缓存携带的GMT时间。若小于，直接使用缓存数据，否则从服务器请求新的文件。

文章插图
不过Expires存在的问题也显而易见。
首先，使用客户端获取的GMT?时间与服务器GMT时间作比较，如果客户端主动修改了系统时间，就会出现缓存命中的误差。
其次，GMT时间是基于格林尼治天文台测算时间后，每隔一小时想全世界发放调时信息。观测本身存在的误差以及非实时的同步机制，都可能会导致出现缓存命中的误差。
所以在HTTP/1.1版本中，使用Cache-Control?中的max-age替代。
2.1.2 HTTP/1.1 - Cache-ControlCache-Control 是HTTP/1.1中重要的缓存规则。它可以在HTTP请求头和响应头中使用，提供了多样化的配置参数。同时也可以适用于更广泛的复杂场景。
指令格式具有以下有效规则：

不区分大小写，但建议使用小写。
多个指令以逗号分隔。
具有可选参数，可以用令牌或者带引号的字符串语法。

常用的指令如下：

no-store：不使用任何形式的缓存。具有HTTP缓存的最高优先级。

文章插图

no-cache：不使用强制缓存。每次进行响应前都向服务器进行缓存有效性验证。

文章插图

public：公共缓存。任何从源服务器到客户端中的每个节点都可以对资源进行缓存。
private：私有缓存。仅客户端可以对资源进行缓存。
max-age：客户端缓存存储的最长时间，单位秒。判断的优先级高于Expires?，客户端会判断资源已缓存的时长是否小于设置的max-age?时长。是则直接使用缓存数据，否则会进行Expires的判断流程。

文章插图

s-maxage：代理缓存服务器最长的缓存时间，单位秒。优先级高于max-age和Expires，仅适用于缓存服务器。

2.2 协商缓存客户端缓存失效后会向服务器进行进行缓存有效性验证，这个缓存有效性验证的过程就是协商缓存? 。若资源有效，则返回304（Not Modified）? 。客户端拿到304状态码后会再从本地缓存中获取资源。整个请求响应过程是与无缓存流程一样的。相对于无缓存流程的优势在于仅响应状态码后，客户端直接从本地缓存获取文件，而无需进行文件下载。减少了网络响应的文件大小，进而加快了网络响应速度。