在PHP 7.4+宝塔环境下启用反向代理,须先建真实域名站点(选纯静态)、放行后端端口、确认127.0.0.1可访问服务;目标URL需带协议和末尾斜杠;启用WebSocket代理并透传Host头与CORS响应头,OPTIONS预检需显式返回204。

在PHP 7.4环境已安装宝塔面板的前提下,为网站启用反向代理功能需绕过PHP版本干扰、确认服务可达性、基于真实域名建站,并严格填写带协议和斜杠的目标地址——漏掉任何一环都会导致502错误。
确认后端服务已就绪并可本地访问
反向代理不是魔法开关,它只转发请求;若后端服务未运行或无法被127.0.0.1访问,代理必然失败。PHP 7.4只是面板默认选中的运行环境,与反向代理本身无关,但容易让人误以为要调用PHP模块。
执行curl -I http://127.0.0.1:3000(将3000换成你的实际端口),看到HTTP/1.1 200或类似响应才算通过。若返回Failed to connect,说明服务根本没起来,此时填进宝塔的所有配置都无效。
进入宝塔「安全」页面→「放行端口」→添加对应端口号(如3000、8080),否则即使服务运行,防火墙也会拦截Nginx的本地回环请求。
立即学习“PHP免费学习笔记(深入)”;
必须先添加一个已解析的域名站点
这是90%用户卡住的第一步:宝塔反向代理入口不独立存在,它藏在某个具体网站的设置里。没有这个“壳”,你连配置界面都打不开。
点击「网站」→「添加站点」→「域名」栏填入已解析到本服务器IP的完整二级域名,例如api.example.com(不能写localhost或未备案测试名)。
根目录保持默认即可,PHP版本务必选【纯静态】——选PHP 7.4会强制加载PHP处理器,干扰代理流程,造成响应头混乱或502。
提交后,该站点必须出现在网站列表中,才能进行下一步操作。
配置反向代理规则
方法一:基础全量代理(推荐新手)
在网站列表中找到刚建的站点→点击「设置」→切换至「反向代理」选项卡→点击「添加反向代理」。
代理名称填backend_service这类易识别的名字;目标URL必须写成http://127.0.0.1:3000/(注意末尾斜杠!缺它会导致路径拼接错乱,比如访问/user变成/user而非/user/)。
勾选「启用代理Websocket」——如果你的后端用Vue DevServer、Socket.IO或Next.js开发服务器,这一步不点,前端连接会卡在pending状态。
方法二:子路径精准分流(需手动改配置)
若想让example.com/admin/走8001端口、example.com/api/走9000端口,宝塔UI不支持多路径共存代理,必须进配置文件补location块。
回到该站点「设置」→「配置文件」,在server {块内、root指令下方插入:
location ^~ /admin/ {<br> proxy_pass http://127.0.0.1:8001/;<br> proxy_set_header Host $host;<br> proxy_set_header X-Real-IP $remote_addr;<br>}
location ^~ /api/ {<br> proxy_pass http://127.0.0.1:9000/;<br> proxy_set_header Host $host;<br> proxy_set_header X-Real-IP $remote_addr;<br>}
保存后点击「重载配置」,Nginx才会读取新规则。
处理跨域与Header透传
第一步:编辑已添加的反向代理条目→展开「高级选项」→在「请求头」区域添加:Host $host。这一步确保后端收到的Host头是真实域名(如api.example.com),而非127.0.0.1:3000——很多框架(WordPress、Laravel)靠Host做路由,不填就404。
第二步:解决浏览器CORS拦截。进入「配置文件」,在location / {块内proxy_pass下方插入:
add_header 'Access-Control-Allow-Origin' '$http_origin' always;<br>add_header 'Access-Control-Allow-Credentials' 'true' always;<br>add_header 'Access-Control-Allow-Methods' 'GET, POST, OPTIONS, PUT, DELETE' always;<br>add_header 'Access-Control-Allow-Headers' 'DNT,User-Agent,X-Requested-With,If-Modified-Since,Cache-Control,Content-Type,Range,Authorization' always;
【必须加always参数】——否则当后端返回401或500时,这些头不会出现,浏览器连错误详情都收不到,只显示空白页或CORS报错。
第三步:显式处理OPTIONS预检请求。在同个location / {块内追加:
if ($request_method = 'OPTIONS') {<br> add_header Access-Control-Allow-Origin "$http_origin";<br> add_header Access-Control-Allow-Methods "GET, POST, OPTIONS, PUT, DELETE";<br> add_header Access-Control-Allow-Headers "DNT,User-Agent,X-Requested-With,If-Modified-Since,Cache-Control,Content-Type,Range,Authorization";<br> add_header Access-Control-Allow-Credentials "true";<br> add_header Access-Control-Max-Age 1728000; <br> add_header Content-Length 0;<br> add_header Content-Type 'text/plain; charset=utf-8';<br> return 204;<br>}



















