如何使用 proxy_set_header 透传真实端口解决多级反代后的静态资源路径错误-Nginx-PHP中文网

关键是要让后端感知真实访问的协议、主机和端口，Nginx需同时配置Host（用$http_host）、X-Forwarded-Proto（用$scheme）和X-Forwarded-Port（用$server_port），后端再据此生成正确静态资源URL。

如何使用 proxy_set_header 透传真实端口解决多级反代后的静态资源路径错误

要解决多级反代后静态资源路径错误（比如 CSS/JS 加载到 80 端口而非实际代理端口），关键不是“透传真实端口”本身，而是让后端应用生成资源 URL 时能感知到客户端访问的真实协议、主机和端口。Nginx 的 proxy_set_header 负责把这三项准确告诉后端，后端再据此构造正确路径。

必须传递的三个核心头字段

仅靠 Host 或 X-Forwarded-For 不够——端口信息缺失是静态资源错加载的直接原因。以下三项需同时配置：

Host：用 $host 或更稳妥的 $http_host（保留原始端口），确保后端拿到的是用户访问的完整 host:port，而不是 localhost:8080
X-Forwarded-Proto：设为 $scheme，让后端知道当前是 http 还是 https，避免混合内容或重定向跳转到 http
X-Forwarded-Port：显式传递端口，值用 $server_port（Nginx 监听端口）或 $http_x_forwarded_port（若上游已传）。这是修复静态资源路径的关键一环

后端需配合解析这些头

Nginx 只负责“递话”，后端必须主动读取并信任这些头才能生效。常见框架处理方式：

WebChat Voice Proxy

⚠️ 已弃用 — 该技能已拆分为两个独立技能，以提升模块化程度：**webchat-https-proxy**（HTTPS/WSS 反向代理）和 **webchat-voi...**

下载

Spring Boot：启用 server.forward-headers-strategy=framework，自动识别 X-Forwarded-* 头构建绝对 URL
Node.js（Express）：设置 app.set('trust proxy', true)，再通过 req.protocol、req.get('X-Forwarded-Host')、req.get('X-Forwarded-Port') 拼接 basePath
Flask：使用 ProxyFix 中间件，并指定 xff_headers=['X-Forwarded-For'] 和 proto_headers=['X-Forwarded-Proto']

多级代理时的注意事项

如果请求链路是「用户 → CDN → Nginx A → Nginx B → 应用」，端口信息容易在中间层丢失：

首层代理（如 CDN）应透传 X-Forwarded-Port；若不支持，可在第一台 Nginx 入口处用 proxy_set_header X-Forwarded-Port $server_port; 补上
后续每层 Nginx 都要继承该头：proxy_set_header X-Forwarded-Port $http_x_forwarded_port;，避免覆盖
禁用 proxy_redirect default 或留空，防止 Nginx 自动重写 Location 响应头导致端口被强制改为 80