# 萌芽漂流瓶（前后端分离版）

- `mengyadriftbottle-backend/`: Flask API（`/api`）+ 管理后台视图（`/admin`）。
- `mengyadriftbottle-frontend/`: React + Vite 单页应用，调用上述 API 并提供用户交互界面。

## 快速开始

### 后端
```cmd
cd mengyadriftbottle-backend
python -m venv .venv
.venv\Scripts\activate
pip install -r requirements.txt
python app.py
```
服务器默认监听 `http://localhost:5002`，所有公开接口挂载在 `http://localhost:5002/api`。

### 前端
确保后端已运行后启动 Vite：
```cmd
cd mengyadriftbottle-frontend
npm install
npm run dev
```
此命令会在 `http://localhost:5173` 打开 React 界面，所有 `/api/*` 请求会被代理到本地 Flask 服务。

### 自定义配置
在 `mengyadriftbottle-frontend` 下创建 `.env` 覆盖默认地址：
```
VITE_API_BASE_URL=http://your-domain/api
VITE_ADMIN_URL=https://your-domain/admin/login
```

后端使用根目录的 `templates/`（管理后台视图）和 `static/`（样式文件），数据文件（`bottles.json`、`config.json` 等）现已迁移至 `mengyadriftbottle-backend/` 目录，所有前端页面由 React 单页应用提供。

### 轻量后台

- 访问 `http://localhost:5002/admin?token=shumengya520`（或自定义 `DRIFT_BOTTLE_ADMIN_TOKEN`）即可查看/删除漂流瓶列表。
- 旧版登录后台依然可通过 `http://localhost:5002/admin/login` 使用。

## Docker 部署

若希望以单一容器运行前后端，可使用根目录提供的 `Dockerfile`：

1. 构建镜像：
	```cmd
	cd e:\Python\前后端分离项目\萌芽漂流瓶
	docker build -t mengyadriftbottle:latest .
	```
2. 创建持久化目录（宿主机）：
	```bash
	mkdir -p /shumengya/docker/storage/mengyadriftbottle
	```
3. 运行容器（对外暴露 6767 端口，并挂载数据目录）：
	```bash
	docker run -d \
	  --name mengyadriftbottle \
	  -p 6767:6767 \
	  -v /shumengya/docker/storage/mengyadriftbottle:/app/mengyadriftbottle-backend \
	  mengyadriftbottle:latest
	```

容器内会：
- 使用 `serve` 在 6767 端口提供构建后的前端静态文件。
- 使用 `gunicorn` 在 5002 端口运行 Flask API（前端通过 `VITE_API_BASE_URL` 访问 `http://localhost:5002/api`）。
- 将 `/app/mengyadriftbottle-backend` 作为数据目录，因此挂载即可让 `bottles.json` 等文件持久化在宿主机 `/shumengya/docker/storage/mengyadriftbottle`。