80 lines
2.4 KiB
Markdown
80 lines
2.4 KiB
Markdown
|
# Nginx 部署配置指南 — AI 绘本创作模块整合
|
|||
|
|
|
|||
|
|
## 概述
|
|||
|
|
|
|||
|
|
AI 绘本创作模块已整合进主前端。该模块通过 `VITE_LEAI_API_URL` 环境变量**直连乐读派后端**（跨域），不走 Nginx 代理。只需确保乐读派后端允许跨域即可。
|
|||
|
|
|
|||
|
|
## 关键配置
|
|||
|
|
|
|||
|
|
| 项目 | 配置方式 | 说明 |
|
|||
|
|
|------|---------|------|
|
|||
|
|
| 乐读派 API 地址 | `.env.*` 中 `VITE_LEAI_API_URL` | 编译时注入，浏览器直连 |
|
|||
|
|
| 乐读派 WebSocket | 自动从 `VITE_LEAI_API_URL` 推导 `ws://` | CreatingView 页面使用 |
|
|||
|
|
| 主后端 API | Nginx 代理 `/api` → `8580` | 与之前相同 |
|
|||
|
|
|
|||
|
|
## 环境变量配置
|
|||
|
|
|
|||
|
|
在每个环境对应的 `.env.*` 文件中配置乐读派后端地址：
|
|||
|
|
|
|||
|
|
```bash
|
|||
|
|
# .env.development / .env.production / .env.test
|
|||
|
|
VITE_LEAI_API_URL=http://192.168.1.120:8080
|
|||
|
|
```
|
|||
|
|
|
|||
|
|
## 乐读派后端 CORS 配置
|
|||
|
|
|
|||
|
|
由于前端直连乐读派后端（跨域），乐读派后端需要配置 CORS：
|
|||
|
|
|
|||
|
|
```yaml
|
|||
|
|
# 乐读派后端 application.yml 需要添加：
|
|||
|
|
allowed-origins:
|
|||
|
|
- http://your-domain.com # 生产域名
|
|||
|
|
- http://localhost:3000 # 本地开发
|
|||
|
|
```
|
|||
|
|
|
|||
|
|
## Nginx 配置示例
|
|||
|
|
|
|||
|
|
```nginx
|
|||
|
|
server {
|
|||
|
|
listen 80;
|
|||
|
|
server_name your-domain.com;
|
|||
|
|
|
|||
|
|
# ─── 主后端 API（与之前相同） ───
|
|||
|
|
location /api/ {
|
|||
|
|
proxy_pass http://127.0.0.1:8580/api/;
|
|||
|
|
proxy_set_header Host $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;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
# ─── 前端静态资源 ───
|
|||
|
|
location /web/ {
|
|||
|
|
alias /path/to/frontend/dist/;
|
|||
|
|
try_files $uri $uri/ /web/index.html;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
# ─── SPA 回退 ───
|
|||
|
|
location / {
|
|||
|
|
return 301 /web/;
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
```
|
|||
|
|
|
|||
|
|
## 开发环境
|
|||
|
|
|
|||
|
|
```bash
|
|||
|
|
# 只需启动一个前端（不再需要 aicreate-client）
|
|||
|
|
cd frontend
|
|||
|
|
npm run dev
|
|||
|
|
```
|
|||
|
|
|
|||
|
|
Vite 代理只需配置主后端 `/api → 8580`，乐读派 API 由浏览器直接访问 `VITE_LEAI_API_URL`。
|
|||
|
|
|
|||
|
|
## 注意事项
|
|||
|
|
|
|||
|
|
1. **CORS 必须配置**：乐读派后端必须允许前端域名的跨域请求
|
|||
|
|
2. **WebSocket 跨域**：Creating 页面的进度推送使用 WebSocket，乐读派后端也需要允许 WS 跨域
|
|||
|
|
3. **HTTPS 环境**：如果前端使用 HTTPS，`VITE_LEAI_API_URL` 建议也使用 `https://`，否则浏览器会阻止混合内容
|
|||
|
|
4. **修改地址后需重新构建**：`VITE_LEAI_API_URL` 是编译时变量，修改后需要 `npm run build`
|