diff --git a/.env.production b/.env.production index 338b7fd..073aad6 100644 --- a/.env.production +++ b/.env.production @@ -28,8 +28,12 @@ REDIS_MAX_CONNECTIONS=50 CORS_ORIGINS=* # API Base URL for frontend -# Set this to your domain or IP address -VITE_API_BASE_URL=http://your-domain.com/api +# 推荐:留空或注释掉,让前端使用相对路径 /api(通过 Nginx 反向代理) +# 这样可以同时支持内网 IP 和外网域名访问 +# VITE_API_BASE_URL= + +# 如果前后端分离部署在不同服务器,才需要设置完整的 API 地址: +# VITE_API_BASE_URL=http://your-domain.com/api # ====================== # Cache Configuration diff --git a/DEPLOYMENT.md b/DEPLOYMENT.md index d2acd49..fa55613 100644 --- a/DEPLOYMENT.md +++ b/DEPLOYMENT.md @@ -146,8 +146,12 @@ CORS_ORIGINS=http://your-domain.com,https://your-domain.com # 方式 4: 同时允许内网 IP 和外网域名(推荐生产环境) CORS_ORIGINS=http://192.168.1.100,http://your-domain.com,https://your-domain.com -# 修改前端 API 地址(必须) -VITE_API_BASE_URL=http://your-domain.com/api +# 前端 API 地址配置 +# 推荐:留空(默认),让前端使用相对路径 /api,自动适配所有访问方式 +# VITE_API_BASE_URL= + +# 如果前后端分离部署在不同服务器,才需要设置完整地址: +# VITE_API_BASE_URL=http://your-domain.com/api ``` **重要说明**: @@ -155,6 +159,7 @@ VITE_API_BASE_URL=http://your-domain.com/api - 每个来源必须包含协议(http:// 或 https://) - 不要在来源末尾添加斜杠 - 使用 `*` 允许所有来源(仅用于开发环境) +- **推荐不设置 `VITE_API_BASE_URL`**,让前端使用相对路径,自动适配内网 IP 和外网域名访问 ### 2. 初始化部署 @@ -368,6 +373,46 @@ docker stats ## 🐛 故障排查 +### 前端 API 请求配置 + +前端的 API 地址有三种工作模式(见 `frontend/src/utils/request.ts`): + +1. **生产模式(推荐)** - 使用相对路径 `/api` + - **配置**: 不设置或注释掉 `VITE_API_BASE_URL` + - **工作原理**: 请求发送到当前访问地址的 `/api` 路径,由 Nginx 反向代理到后端 + - **优点**: 自动适配所有访问方式(内网 IP、外网域名) + - **示例**: + - 访问 `http://192.168.1.100` → API 请求到 `http://192.168.1.100/api` + - 访问 `http://domain.com` → API 请求到 `http://domain.com/api` + +2. **指定完整 API 地址** - 跨域或前后端分离部署 + - **配置**: `VITE_API_BASE_URL=http://your-server.com/api` + - **工作原理**: 所有 API 请求都发送到指定的完整地址 + - **缺点**: 只能指定一个地址,无法同时支持多种访问方式 + +3. **开发模式** - 自动检测 + - **配置**: 不设置 `VITE_API_BASE_URL` + `npm run dev` + - **工作原理**: 自动使用 `http://当前主机名:8000/api` + +**常见问题**: + +❌ **问题**: 内网 IP 访问时,API 请求跳到外网域名 +```bash +# 原因:设置了完整的 API 地址 +VITE_API_BASE_URL=http://your-domain.com/api +``` +✅ **解决**: 注释掉或删除 `VITE_API_BASE_URL`,让前端使用相对路径 + +❌ **问题**: API 请求 404 Not Found +```bash +# 检查 Nginx 是否正常运行 +docker-compose ps frontend +docker-compose logs frontend + +# 检查 Nginx 配置是否正确 +docker-compose exec frontend nginx -t +``` + ### CORS 配置错误 **错误信息**: