252 字
1 分钟
Nginx 使用 sub_filter 注入自定义 HTML 标签
在反向代理第三方服务时，若需要在页面中注入自定义 JS/CSS，但无法修改源码，可以借助 Nginx 的 sub_filter 指令在响应内容中做字符串替换注入。
NOTE
sub_filter由ngx_http_sub_module模块提供，编译 Nginx 时需确认已包含该模块：
配置示例
以下示例在代理 Uptime Kuma 状态页时，通过 sub_filter 在 </head> 前注入自定义资源：
map $http_upgrade $connection_upgrade { default upgrade; '' close;}
server { listen 80; server_name status.example.com;
location ^~ /status/external { proxy_pass http://10.0.0.11:3001/status/external;
proxy_set_header Host $http_host; proxy_set_header X-Real-IP $remote_addr; proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for; proxy_set_header X-Forwarded-Proto $scheme;
proxy_http_version 1.1; proxy_set_header Upgrade $http_upgrade; proxy_set_header Connection $connection_upgrade;
# 在 </head> 前注入自定义资源 sub_filter '</head>' '<script src="/main.js"></script>'; sub_filter '</head>' '<link rel="stylesheet" href="/main.css">'; sub_filter '</head>' '<link rel="stylesheet" href="/iconfont.css">';
sub_filter_once off; # off = 替换所有匹配 sub_filter_types *; # 对所有 MIME 类型生效 }}常用指令说明
| 指令 | 说明 |
|---|---|
sub_filter string replacement | 将响应中的 string 替换为 replacement |
sub_filter_once on|off | on（默认）只替换第一处；off 替换全部匹配 |
sub_filter_types * | 指定生效的 MIME 类型，默认仅 text/html |
sub_filter_last_modified on|off | 是否在替换后修改响应的 Last-Modified 头 |
注意事项
- 如果后端响应启用了 gzip 压缩，
sub_filter无法处理压缩内容，需在location内添加proxy_set_header Accept-Encoding "";禁用后端压缩。 - 注入的静态资源路径中不能使用动态变量，否则浏览器无法解析。建议将静态资源缓存到 Nginx 本地后统一提供。
分享
如果这篇文章对你有帮助，欢迎分享给更多人！
Nginx 使用 sub_filter 注入自定义 HTML 标签
https://blog.olinl.com/posts/nginx-subfilter-html/ 相关文章 智能推荐
1
Nginx 常用配置速查
服务与应用运维 整理 Nginx 最常用的配置场景，包括静态站点、Vue 单页应用、SSL/HTTPS、反向代理、WebSocket 代理以及 MinIO 签名代理等配置示例。
2
CentOS 安装 Nginx 及生产环境配置指南
服务与应用运维 介绍在 CentOS 上通过 YUM 安装 Nginx，并整理多站点、SSL、反向代理、Stream TCP 代理等常用生产配置模板。
3
跳过登录弹框：实现 Basic Auth 自动授权
技术插曲与避坑 详解如何通过 URL 传参、Nginx 反向代理注入 Header 以及浏览器插件等方式，实现对 Basic Auth 认证站点的免密自动登录。
4
CI/CD 手册：Jenkins 自动化发布全流程
服务与应用运维 详细记录如何通过 Jenkins 搭建自动化流水线，实现 Node.js 前端项目与 Spring Boot 后端项目的打包、上传及一键部署。
5
Ubuntu安装IntelliJ IDEA
服务与应用运维 详解在 Ubuntu 系统下安装 IntelliJ IDEA 的标准流程，涵盖手动解压安装、创建桌面快捷方式及全局环境变量配置。
