Hexo 博客缓存问题与解决方案
遇到的问题
我的 Hexo 博客部署在 Cloudflare 上，使用 GitHub 作为代码仓库。最近发布文章时发现，由于浏览器和 CDN 的强缓存，更新文章后，刷新页面却看不到新内容。
- 电脑端尚可通过
Ctrl + F5进行强制刷新来解决。 - 手机端就非常尴尬，往往需要完全清除浏览器记录或开启无痕模式，经常要折腾半天才能刷出新内容。
我们可以为部署平台（如 Vercel, GitHub Pages, Netlify, Cloudflare Pages 等）创建一个 _headers 文件。这个文件就像一份给浏览器的“缓存说明书”，可以精确地告诉浏览器：哪些内容需要缓存，以及缓存多久。
下面是优化后的缓存配置策略，已整合为一份完整的配置：
# 所有 HTML 页面：不缓存，每次请求最新版本
/*.html
Cache-Control: no-cache, no-store, must-revalidate
Pragma: no-cache
Expires: 0# 首页、分页、标签页、分类页等路径：同样不缓存
/
Cache-Control: no-cache, no-store, must-revalidate
Pragma: no-cache
Expires: 0
/page/*
Cache-Control: no-cache, no-store, must-revalidate
Pragma: no-cache
Expires: 0
/tag/*
Cache-Control: no-cache, no-store, must-revalidate
Pragma: no-cache
Expires: 0
/category/*
Cache-Control: no-cache, no-store, must-revalidate
Pragma: no-cache
Expires: 0
# 静态资源：JS、CSS、图片、图标等，长期缓存（一年）
/*.css
Cache-Control: public, max-age=31536000, immutable
/*.js
Cache-Control: public, max-age=31536000, immutable
/*.png
/*.jpg
/*.jpeg
/*.gif
/*.ico
/*.svg
Cache-Control: public, max-age=31536000, immutable
配置说明与好处
/*.html：匹配所有文章页面、独立页面和首页HTML文件。no-cache, no-store：指令浏览器不要缓存或本地存储这些内容。must-revalidate：要求浏览器每次都必须向服务器验证内容的有效性。Expires: 0：设置资源立即过期。
应用此配置后，效果立竿见影：
- 内容实时更新：发布文章后能立刻显示，再也看不到陈旧的缓存内容，无需手动清除浏览器缓存。
- 访问速度依旧快：此方案设计合理，在确保HTML（文章、首页）每次获取最新的同时，继续对JS、CSS、图片等静态资源进行长达一年的缓存，充分利用缓存优势。
- 无额外负担：仅禁止缓存体积很小的HTML文件，不会增加服务器流量压力。
- SEO友好：搜索引擎每次抓取都能获得最新内容，避免了因缓存导致网站内容更新不被收录的问题。