缓存可以减少传输和重复请求,但设置得过长也会让更新迟迟不生效。静态博客适合把 HTML 与带版本的资源分开设计。

HTML 与资源不必采用同一策略

HTML 决定页面引用哪些资源,通常需要较短的新鲜期或允许重新验证。带内容哈希的资源文件可以采用较长缓存;如果文件名不变而内容改变,长期 immutable 很容易让读者一直使用旧版本。

304 不是失败

客户端携带 If-None-Match 或 If-Modified-Since 重新验证时,服务端可以返回 304,表示继续使用已有副本。这个请求仍然发生了,只是省去响应正文。检查工具看到 304 时,要结合缓存与请求头理解。

浏览器缓存与 CDN 缓存分别管理

Cache-Control 中的指令可能对浏览器、共享缓存产生不同影响。CDN 还可能设置额外规则。排查时应查看 Age、Vary 和相关缓存状态,不要把本机强刷等同于所有用户缓存被清空。

小步调整并保留验证路径

先对 CSS、JavaScript 和图片设置适度缓存,再验证更新行为。确保不存在或已移除的资源返回正确的 404,而不是缓存一份错误页面。部署后抽查响应头,并在真实页面中确认样式和脚本版本一致。

操作参考

1
2
3
curl -I https://example.com/css/site.css
# 将真实响应中的 ETag 值填入后再测试
curl -I -H 'If-None-Match: "REPLACE_WITH_ETAG"' https://example.com/css/site.css

示例中的域名、文件名和地址需按实际环境替换。涉及生产配置时,先保留可恢复副本,再做修改。

参考资料