如何通过sub_filter_types精确设置内容替换类型，降低网关层静态资源处理成本？

本文共计623个文字，预计阅读时间需要3分钟。

需要让 sub_filter 只处理 CSS 和 JS 文件，核心不是“过滤掉其他类型，而是只打开需要的类型——使用 sub_filter_types 明确声明 text/css 和 application/javascript，其他类型不碰。这样既避免误改 JSON、SVG、字体等非目标内容，又减少 Nginx 对无关响应的解析开销。”

只放行真正需要的 MIME 类型

默认情况下，sub_filter 仅作用于 text/html，对 CSS/JS 完全静默。必须主动添加：

• sub_filter_types text/css application/javascript;
• 不要写 * —— 它会强制扫描所有响应体，包括二进制流（如图片、字体），不仅无效还拖慢性能
• 拼写必须准确：application/javascript 是标准写法，text/javascript 已废弃，Nginx 不识别

确保后端返回正确的 Content-Type

即使配置了 sub_filter_types，如果后端返回的 JS 文件头是 Content-Type: text/plain 或干脆没设，替换依然不会触发。

• 用 curl -I https://yoursite/static/app.js 检查实际响应头
• 若不匹配，优先修复后端设置；静态文件场景下可临时在 Nginx 中补全：add_header Content-Type application/javascript;（需配合 types {} 或明确 location）
• 特别注意：.css 文件若被后端误标为 text/plain，同样跳过处理

关闭干扰项，保证替换稳定生效

压缩和分块传输会让 sub_filter 失效，不是配置问题，而是机制限制：

• 必须禁用 gzip：gzip off;（推荐在对应 location 块中关闭，不影响全局）
• 避免 Transfer-Encoding: chunked：启用 proxy_buffering on; 并合理设置 proxy_buffer_size 和 proxy_buffers，让 Nginx 缓存完整响应再处理
• 不支持正则、不解析 HTML 结构，所以路径替换建议加前后缀边界，例如用 '"/static/' 而非 '/static/'，减少误替

典型轻量灰度切换配置示例

比如把内网静态资源路径统一映射到 CDN，且只动 CSS/JS：

location /static/ { proxy_pass http://origin-server/; sub_filter '/static/' 'https://cdn.example.com/static/'; sub_filter_once off; sub_filter_types text/css application/javascript; gzip off; proxy_buffering on; proxy_buffer_size 4k; proxy_buffers 8 4k; }