Apache需监听新端口(如8081)并启用mod_proxy、mod_proxy_http模块,通过VirtualHost配置ProxyPass将请求代理至Strapi的127.0.0.1:1337,同时设置ProxyPreserveHost On和Require all granted以确保正确转发与访问权限。

Strapi 默认使用 localhost:1337,但如果你已在 XAMPP 中运行 Apache(监听 80 或 8080),又想让 Strapi 项目通过 Apache 反向代理或共存访问(比如用 http://localhost:8081 直接跳转到 Strapi),就必须手动配置 Apache 多端口,并确保不与 Strapi 自身端口冲突。XAMPP 本身不“支持” Strapi,它只提供 Apache;真正要做的,是让 Apache 和 Strapi 在同一台机器上和平共处、按需路由。
修改 httpd.conf 添加额外监听端口
Strapi 启动后独占 1337,你不能也不该让 Apache 去监听这个端口——Apache 的 Listen 指令只用于它自己处理 HTTP 请求。你要的是 Apache 开一个新端口(如 8081),然后把它指向 Strapi 的本地服务(127.0.0.1:1337)。
打开 C:\XAMPP\apache\conf\httpd.conf,找到已有 Listen 80 行,在其下方添加:
Listen 8081
注意:8081 必须未被其他程序占用(可用 netstat -ano | findstr :8081 验证);若已被占,换一个如 8082 即可。
同时确认这一行没被注释:
Include conf/extra/httpd-vhosts.conf
在 httpd-vhosts.conf 中配置反向代理(关键)
仅开个端口没用——Apache 默认不会把请求转发给 Strapi。你必须启用 mod_proxy 和 mod_proxy_http,再用 ProxyPass 把 *:8081 的所有流量代理到 http://127.0.0.1:1337。
先启用模块:在 httpd.conf 中取消以下两行的注释(删掉开头 #):
LoadModule proxy_module modules/mod_proxy.so LoadModule proxy_http_module modules/mod_proxy_http.so
然后编辑 C:\XAMPP\apache\conf\extra\httpd-vhosts.conf,在末尾添加:
XAMPP 8.0.30 是一款免费、开源的跨平台 Web 服务器集成包,专为快速搭建本地 PHP 开发环境而设计。该版本核心组件包括:Apache 2.4.56、MySQL 8.0.33、PHP 8.0.30、phpMyAdmin 5.2.1 等。它支持 Windows、Linux 和 macOS 系统,可让开发者在个人电脑上轻松模拟服务器环境,无需复杂配置即可运行 WordPress、Thin
<virtualhost>
ServerName localhost
ProxyPreserveHost On
ProxyPass / http://127.0.0.1:1337/
ProxyPassReverse / http://127.0.0.1:1337/
<location></location>
Require all granted
</virtualhost>
说明:
-
ProxyPreserveHost On确保 Strapi 收到的Host头仍是localhost:8081,这对某些 Strapi 插件(如 upload)的 URL 生成很重要 - 不要漏掉
Require all granted,否则会返回 403 - 路径结尾的
/必须一致,否则代理会出错或重定向失败
启动顺序和常见 502 错误排查
Apache 启动时如果 Strapi 还没跑起来,访问 http://localhost:8081 就会报 502 Proxy Error——这不是配置错误,只是服务未就绪。
正确流程是:
- 先手动启动 Strapi:
cd your-strapi-project && npm run develop(确保终端显示Server running on http://localhost:1337) - 再在 XAMPP 控制面板中启动 Apache
- 浏览器访问
http://localhost:8081,应看到 Strapi Admin 登录页
容易踩的坑:
- Strapi 的
config/server.js中url字段写死为http://localhost:1337→ 浏览器里上传图片后链接仍带:1337。应改为url: 'http://localhost:8081'(开发环境可接受) - Windows 防火墙拦截了
8081端口 → 临时关闭防火墙测试,或放行该端口 - 改完配置后没执行
httpd -t验证 → 在C:\XAMPP\apache\bin下运行命令,提示Syntax OK才重启
为什么不用直接访问 :1337?
因为 Strapi 的 Admin UI 依赖前端资源加载,而它的默认 CORS 策略只允许同源请求。如果你用 Nginx/Apache 做统一入口(如 dev.local),或需要 HTTPS 代理、路径前缀(/api)、静态文件共存(前端 HTML + Strapi API 同域名),就必须走反向代理。直接暴露 :1337 在协作或 CI 场景下会很快遇到跨域、证书、路径混乱等问题。
真正的复杂点不在配置本身,而在于 Strapi 的静态资源路径、管理后台的 base URL、以及前端调用 API 时是否感知代理层——这些地方一旦写死端口,后续换部署方式就会卡住。
大量免费API接口:立即使用
涵盖生活服务API、金融科技API、企业工商API、等相关的API接口服务。免费API接口可安全、合规地连接上下游,为数据API应用能力赋能!










