实现预览/草稿实时缓存绕过需精准跳过缓存查找、直连后端：1. nginx 用 proxy_cache_bypass 配合请求头（如 x-preview: 1）；2. url 参数（如 ?preview=1）配合 set 变量判断；3. 后端返回 x-cache-bypass: 1 由 cdn 响应头驱动绕过；4. spa 中统一配置 /preview/** 路径绕过并确保 api 携带对应请求头。
要实现预览模式或草稿状态下的实时缓存绕过，核心是让特定请求“不查缓存、直连后端”，同时不影响其他用户正常访问。这不是清缓存，而是精准跳过缓存查找环节，确保编辑人员看到的是最新未发布内容。
用请求头触发绕过（Nginx 最常用）
在 Nginx 配置中使用 proxy_cache_bypass 指令，配合自定义请求头判断是否绕过：
- 前端（如 CMS 后台）在预览时主动带上请求头，例如 X-Preview: 1 或 X-Draft: true
- Nginx 配置示例：
proxy_cache_bypass $http_x_preview $http_x_draft; - 这样只要请求含对应 Header，Nginx 就跳过 cache lookup，直接转发给后端；其余请求照常走缓存
用 URL 参数控制（开发/测试友好）
适合临时调试或无权限改请求头的场景，比如运营人员点击“预览”按钮时自动拼接参数：
- 约定参数如 ?preview=1 或 &draft=t
- Nginx 中需先将参数映射为变量：
set $bypass_cache 0;<br>if ($args ~* "preview=1|draft=") { set $bypass_cache 1; }
再写：proxy_cache_bypass $bypass_cache; - 注意：URL 参数易被缓存系统误识别，建议搭配 Cache-Control: no-cache 响应头，避免中间 CDN 二次缓存该 URL
后端动态响应头协同（增强可靠性）
仅靠 Nginx 判断有时不够——比如草稿页需校验登录态、权限、版本号。可由后端返回一个特殊响应头，反向通知边缘节点绕过：
- 后端在渲染草稿页时，添加响应头：X-Cache-Bypass: 1
- ESA（阿里云边缘安全加速）或支持自定义规则的 CDN，可配置“当响应头含 X-Cache-Bypass=1 时，对该请求不缓存”
- 注意：Nginx 的
proxy_cache_bypass只看请求头，不看响应头；此方式需 CDN 或网关层支持响应头驱动的缓存策略
SPA 应用中的客户端配合技巧
单页应用（如 Vue/React 管理后台）常通过路由区分正式页与预览页（如 /post/123 vs /preview/post/123）：
- 在边缘配置中，将 /preview/** 路径统一设为“绕过缓存”
- 前端路由守卫可自动注入 preview 模式标识，并确保所有接口请求也携带 X-Preview 头
- 避免只改 HTML 路由却不改 API 请求头，否则页面是新的，数据仍是缓存的
