当s-maxage > max-age时如何实现浏览器本地缓存？

问题1：这是预期行为吗？ #

是的，这完全符合HTTP缓存的规范行为。

Age头用于标识资源从源服务器生成后已经过的时长，浏览器判断本地缓存是否新鲜的逻辑是：资源总存活时长（Age值 + 本地已缓存时长）不能超过max-age。当代理返回的资源Age已大于等于max-age时，该资源到达浏览器时就处于“过期”状态，因此浏览器每次请求都会触发重新验证，这是规则内的正常表现。

问题2：如何让浏览器在请求后始终缓存60秒？ #

想要同时满足代理长缓存减轻源站压力和浏览器短缓存加速会话的目标，有以下几种可行方案：

方案1：让边缘缓存动态调整返回给浏览器的max-age #

大部分商用CDN或自定义代理支持“动态TTL”配置：当代理向浏览器返回资源时，自动将max-age设置为固定的浏览器缓存时长（比如60秒），或计算s-maxage剩余时长（确保不低于浏览器需要的缓存时间）。这样无论代理缓存中的资源Age多大，浏览器拿到的max-age都是符合需求的固定值，能保证本地缓存60秒。

方案2：使用stale-while-revalidate指令 #

在Cache-Control中添加stale-while-revalidate=60，完整配置如下：

Cache-Control: max-age=60, s-maxage=86400, stale-while-revalidate=60

这个指令的作用是：当资源缓存过期后（比如Age超过max-age），浏览器可以继续使用本地缓存60秒，同时在后台异步发起重新验证请求更新缓存。既保证了浏览器的访问速度，又能确保缓存最终更新，是平衡性能和新鲜度的常用方案。

注意：强制忽略Age的潜在风险 #

如果试图让浏览器完全忽略Age头强制缓存，这违反HTTP缓存规范，属于不推荐的实践。这种操作可能导致浏览器长时间使用过期资源，无法及时获取源服务器的更新，引发业务数据不一致的问题。

内容的提问来源于stack exchange，提问作者floorish