140 lines
3.1 KiB
Markdown
140 lines
3.1 KiB
Markdown
# 萌芽短链 - 前后端分离部署说明
|
||
|
||
## 架构说明
|
||
|
||
- **前端**：构建为静态HTML文件，部署在Nginx服务器（8989端口）
|
||
- **后端**：部署在Docker容器中（7878端口）
|
||
|
||
## 部署步骤
|
||
|
||
### 一、后端部署（Docker容器）
|
||
|
||
1. **构建Docker镜像**
|
||
```bash
|
||
cd mengyalinkfly-backend
|
||
docker build -t mengyalinkfly-backend:latest .
|
||
```
|
||
|
||
2. **运行Docker容器**
|
||
```bash
|
||
docker run -d \
|
||
--name mengyalinkfly-backend \
|
||
-p 7878:7878 \
|
||
-v /shumengya/docker/storage/mengyalinkfly:/app/data \
|
||
--restart unless-stopped \
|
||
mengyalinkfly-backend:latest
|
||
```
|
||
|
||
3. **查看容器日志**
|
||
```bash
|
||
docker logs -f mengyalinkfly-backend
|
||
```
|
||
|
||
### 二、前端部署（静态文件）
|
||
|
||
1. **构建前端**
|
||
```bash
|
||
cd mengyalinkfly-frontend
|
||
npm install
|
||
npm run build
|
||
```
|
||
|
||
2. **部署到Nginx**
|
||
```bash
|
||
# 复制构建产物到服务器
|
||
cp -r dist/* /shumengya/www/mengyalinkfly-frontend/
|
||
|
||
# 复制nginx配置（根目录下的nginx.conf）
|
||
cp nginx.conf /etc/nginx/sites-available/mengyalinkfly
|
||
ln -s /etc/nginx/sites-available/mengyalinkfly /etc/nginx/sites-enabled/
|
||
|
||
# 测试nginx配置
|
||
nginx -t
|
||
|
||
# 重启nginx
|
||
systemctl restart nginx
|
||
```
|
||
|
||
## 配置说明
|
||
|
||
### 1. 修改前端服务器地址
|
||
|
||
编辑 `nginx.conf`，将 `localhost` 替换为实际的后端服务器IP（如果前后端不在同一台机器）：
|
||
|
||
```nginx
|
||
# 如果后端在其他服务器，修改为实际IP
|
||
location /api {
|
||
proxy_pass http://后端服务器IP:7878;
|
||
...
|
||
}
|
||
|
||
location ~ ^/[a-zA-Z0-9]{4}$ {
|
||
proxy_pass http://后端服务器IP:7878;
|
||
...
|
||
}
|
||
```
|
||
|
||
### 2. 修改CORS配置
|
||
|
||
编辑 `mengyalinkfly-backend/app.py`，添加你的前端域名：
|
||
|
||
```python
|
||
CORS(app, origins=[
|
||
"http://localhost:8989",
|
||
"http://127.0.0.1:8989",
|
||
"http://your-frontend-domain.com" # 添加你的实际域名
|
||
])
|
||
```
|
||
|
||
## 访问方式
|
||
|
||
- **前端页面**：http://your-server:8989
|
||
- **后端API**：http://your-server:7878/api/*
|
||
- **短链跳转**：http://your-server:8989/XXXX （4位短链代码）
|
||
|
||
## 功能特点
|
||
|
||
✅ **支持浏览器访问** - 通过前端页面创建和管理短链接
|
||
✅ **支持命令行工具** - wget、curl可直接下载文件（自动HTTP 302重定向）
|
||
✅ **前后端分离** - 易于扩展和维护
|
||
✅ **Docker容器化** - 后端一键部署
|
||
|
||
## 测试命令
|
||
|
||
```bash
|
||
# 测试后端API
|
||
curl http://localhost:7878/api/links
|
||
|
||
# 测试短链跳转（浏览器）
|
||
curl -L http://localhost:8989/4GLS
|
||
|
||
# 测试wget下载（命令行）
|
||
wget http://localhost:8989/4GLS
|
||
```
|
||
|
||
## 目录结构
|
||
|
||
```
|
||
/shumengya/
|
||
├── www/
|
||
│ └── mengyalinkfly-frontend/ # 前端静态文件目录
|
||
│ ├── index.html
|
||
│ ├── assets/
|
||
│ └── ...
|
||
└── docker/
|
||
└── storage/
|
||
└── mengyalinkfly/ # 后端数据持久化目录
|
||
└── link_data.json
|
||
```
|
||
|
||
## 常见问题
|
||
|
||
### 1. wget下载HTML而不是文件？
|
||
确保nginx配置中有短链匹配规则，并且优先级在前端路由之前。
|
||
|
||
### 2. API跨域错误？
|
||
检查后端的CORS配置，确保包含了前端域名。
|
||
|
||
### 3. 容器无法启动？
|
||
检查端口7878是否被占用：`netstat -tulpn | grep 7878`
|