你用91大事件总觉得不顺？大概率是缓存管理没对上（建议收藏）
你用“91大事件”总觉得显示、更新或功能怪怪的？大概率不是你“运气差”，而是缓存管理没对上。缓存能加速体验，但一旦策略或实现出问题，页面数据、图标、通知和功能都会出现不同步、旧数据或无响应的情况。下面给出面向普通用户和开发者的排查与解决方案，建议收藏，遇到问题先按步骤来排。
一、先判断——是不是缓存惹的祸？ 常见症状：
- 刚改过内容，但页面仍显示旧数据；
- 功能已上线但你这儿无响应，或页面报错 JS 依然是旧版本；
- 用户头像、图标等静态资源更新迟缓；
- 有时刷新有效，有时无效，或在不同设备表现不同。
二、普通用户能做的“立刻见效”的几步 1) 强制刷新浏览器（Web 版）
- Windows/Chrome/Edge：Ctrl + F5 或 Ctrl + Shift + R
- macOS/Safari/Chrome：Cmd + Shift + R 2) 清除浏览器缓存
- Chrome：设置 → 隐私与安全 → 清除浏览数据 → 勾选“缓存的图片和文件” → 清除。快捷键 Ctrl/Cmd + Shift + Del。
- Safari（Mac/iOS）：开发者菜单 → Empty Caches，或 iOS 上设置 → Safari → 清除历史记录与网站数据。 3) 断开并重连网络（有时 CDN 节点或运营商缓存导致问题） 4) 切换设备或网络（手机数据流量 vs 家中 Wi‑Fi）看问题是否复现 5) App 用户（Android/iOS）
- Android：设置 → 应用 → 91大事件 → 存储 → 清除缓存
- iOS：设置 → 通用 → iPhone 存储空间 → 91大事件 → 卸载应用（或“卸载应用”再重装） 6) 如果是 PWA 或使用 Service Worker 的 Web 版
- 打开浏览器开发者工具 → Application → Service Workers → 点击 Unregister，然后做一次硬刷新
三、给开发者和站点维护者的诊断清单（从快到深） 快速检查
- 在浏览器 DevTools 的 Network 选项卡勾选“Disable cache”，然后刷新查看是否问题仍在。
- 使用 curl 查看响应头：curl -I https://your.site/endpoint
- 关注 Cache-Control，ETag，Last-Modified，Expires 等字段。
- 检查 Service Worker 是否在缓存旧资源（DevTools → Application → Service Workers / Cache Storage）
常见问题与修复策略 1) 静态资源（JS/CSS/图片）长期缓存但没有版本号
- 方案：采用资源指纹（例如 app.abc123.js）或在引用时加版本号（?v=202602）。
- 不建议长期用 query string 代替真正的文件名指纹，前者在某些 CDN/代理上表现不一致。 2) Cache-Control 设置不当
- 对于频繁变动的 API：Cache-Control: no-store 或 no-cache, must-revalidate。
- 对于版本化静态资源：Cache-Control: public, max-age=31536000, immutable（配合文件名指纹）。 3) ETag / Last-Modified 配合不正确
- ETag 能减少带宽，但如果服务器没有在资源变更时更新 ETag，会导致客户端缓存旧内容。确保部署流程能触发 ETag 更新，或直接用版本化策略。 4) CDN 缓存未清除或延迟
- 部署新版本后触发 CDN 清除（purge）。对需要即时生效的资源，合理设置短 TTL 或在部署时做自动化清除。 5) Service Worker 更新策略不当（PWA）
- Service Worker 安装后默认不会马上接管旧页面。常见做法：
- 在 new SW 中调用 self.skipWaiting()，并在激活时 clients.claim()。
- 通过 postMessage 通知客户端更新并提示用户刷新。
- 小心更新时瞬间出现版本混用（老 SW 服务旧缓存 + 新代码），需要设计平滑更新逻辑。 6) 本地存储（localStorage、IndexedDB）数据未同步
- 若你的应用把状态写入 localStorage，部署时若结构或键名变更要做好迁移或重置逻辑，避免读取旧格式导致异常。
四、推荐的缓存策略模板（按资源类型）
- 动态 API：Cache-Control: no-store 或 no-cache, must-revalidate（即刻生效）
- 站点主 HTML（单页应用入口 index.html）：短 TTL（例如 60s）或 no-cache，并在 HTML 中引用带指纹的静态资源
- 静态资源（带指纹的 JS/CSS/图片）：Cache-Control: public, max-age=31536000, immutable
- CDN：部署时自动 purge 或使用版本控制路径
五、排查流程（快速指南） 1) 先做强制刷新 / 清缓存 / 更换网络，确认是否用户侧缓存问题 2) 若问题仍在，检查是否所有用户或仅部分用户受影响（全量 vs 个别） 3) 在 DevTools 检查 Network、Application（Service Worker、Cache Storage、Local Storage） 4) 查看响应头（curl -I），确认 Cache-Control、ETag、Expires 等 5) 若使用 CDN，检查是否需要手动清除或等待 TTL 结束 6) 如果是 PWA，检查 SW 更新与激活流程 7) 根据定位结果调整策略并进行小范围灰度验证，再全量发布
六、实用命令和位置速查
- 查看响应头：curl -I https://your.site/path
- Chrome 清缓存并硬刷新：打开 DevTools → 右键刷新按钮 → Empty Cache and Hard Reload
- 取消 Service Worker：DevTools → Application → Service Workers → Unregister
- Android 清 App 缓存：设置 → 应用 → 目标应用 → 存储 → 清除缓存
- iOS 卸载并重装应用：按住图标 → 删除 App → App Store 重新安装
七、给产品/运维/开发的协作建议（一句话版） 部署时把资源版本管理、CDN 清理和 Service Worker 更新纳入 CI 流程；发布后先灰度验证，确保缓存策略与发布节奏一致，用户端遇到问题时提供一套“清缓存+重装+查看版本号”的排查指引。
