直接调整 Cloudflare 控制台中的 Browser Cache TTL 是最快生效的方法，适合静态资源占比高的站点，但需注意动态内容避免缓存过久。
先说结论：通过 Cloudflare 控制台设置 Browser Cache TTL 可以指示访客浏览器缓存资源，从而减少重复请求，但需区分静态与动态内容。
- 先定位：确认哪些资源是静态的（如 css、js、图片），哪些是动态的（如 html、api）。
- 先做：在 Caching 配置中将 Browser Cache TTL 设为适当时间，静态资源可设较长，但建议配合 Cache Rules 排除 HTML 文件。
- 再验证：使用 curl 命令检查响应头中的 cache-control 是否生效。
命令速用版
Cloudflare 主要通过控制台配置，无需服务器命令，但可用 curl 验证：
curl -I https://yourdomain.com/static/style.css
关注返回头中的 cache-control 字段。
为什么会这样
Browser Cache TTL 设置的是访客浏览器本地缓存的生存时间。当用户再次访问时，如果资源未过期，浏览器会直接使用本地副本，不再向 Cloudflare 或源站发送请求。这与 Cloudflare 边缘节点的缓存不同，后者是减少回源，而浏览器缓存是减少用户端的网络请求。
分步处理
- 登录 Cloudflare dashboard，选择对应域名。
- 进入左侧 Caching > Configuration。
- 找到 Browser Cache TTL 选项，默认通常为几小时。
- 根据资源类型调整：静态资源可设为 1 个月或更久，但建议配合 Cache Rules 排除 HTML 文件；动态内容建议保持默认或更短。
- 如需更精细控制，可使用 Cache Rules 针对特定路径设置 Edge Cache TTL 和 Browser Cache TTL。
静态资源 TTL 推荐值参考
| 资源类型 | 文件扩展名示例 | 推荐 Browser Cache TTL | 说明 |
|---|---|---|---|
| 样式与脚本 | .css, .js | 1 个月 - 1 年 | 若有版本哈希可设更长 |
| 图片与字体 | .png, .jpg, .woff | 1 个月 - 1 年 | 静态不变资源 |
| HTML 文档 | .html, / | 0 - 4 小时 | 避免内容更新不及时 |
| API 接口 | /api/* | 0 - 无缓存 | 确保数据实时性 |
进阶：使用 Cache Rules 精细控制
全局设置高 TTL 时缺乏具体的 Cache Rules 配置示例，可能导致 HTML 误缓存。建议创建规则排除 HTML：
- 进入左侧 Caching > Cache Rules。
- 点击 Create rule。
- 设置匹配条件：Field 选择 "File Extension"，Operator 选择 "equals"，Value 填写 "html"。
- 设置缓存策略：Edge Cache TTL 和 Browser Cache TTL 均设为 "No Cache" 或较短时间（如 4 小时）。
- 保存并部署。
怎么验证是否生效
在终端使用 curl 命令查看响应头：
curl -I https://yourdomain.com/css/main.css
检查是否包含类似 cache-control: public, max-age=2592000 的字段。同时观察 cf-cache-status，首次请求可能为 MISS，后续请求应为 HIT（指边缘缓存），浏览器缓存需通过浏览器开发者工具 Network 面板查看 Size 列是否为 disk cache。
常见坑
- HTML 文件缓存过久：导致内容更新后用户无法看到最新页面，若全局设置长 TTL 且未配置排除 HTML 的规则，可能导致页面更新不及时，建议 HTML 不缓存或缓存时间极短。
- SSL 模式错误：若源站强制 HTTPS 而 Cloudflare 设为 Flexible，可能导致重定向循环，建议设为 Full 或 Full (Strict)。
- Cache Rules 优先级：Cache Rules 的设置会覆盖全局 Browser Cache TTL 设置，需检查是否有冲突规则。
参考来源
- Cloudflare 官方学习中心 - What is cache control? (https://www.cloudflare.com/zh-cn/learning/cdn/glossary/what-is-cache-control/)
- Cloudflare 官方学习中心 - What is DNS caching? (https://www.cloudflare.com/learning/dns/what-is-dns-caching/)