# 前后端分离部署说明

项目支持**前后端分离**部署：前端为纯静态资源，后端为独立 Node API，便于分别部署到静态主机与 API 服务器。

---

## 一、目录与职责

| 类型 | 目录/文件 | 说明 |
|------|-----------|------|
| **前端（静态）** | `index.html`, `config.json`, `api.config.json`, `lib/`, `image/` | 可部署到 Nginx、OSS、Vercel、GitHub Pages 等 |
| **后端（API）** | `server/`（含 `server.js`, `db.js`, `index.js`, `package.json`） | 单独部署到 Node 主机，仅提供 `/api/*` 接口 |

---

## 二、前端部署

1. **构建静态包**（在项目根目录）：
   ```bash
   npm run build
   ```
   产出目录 `dist/`，内含：`index.html`, `config.json`, `api.config.json`, `lib/`, `image/`。

2. **配置 API 地址**：  
   将 `dist/` 部署到你的静态站点后，修改 **`dist/api.config.json`**（或部署前在根目录改好再 build）：
   ```json
   {
     "apiBase": "https://你的API域名"
   }
   ```
   - 不填或空字符串 `""` 表示与当前页面同源（例如 Nginx 反向代理了 `/api` 到后端时可用 `""`）。
   - 前后端不同域时填后端根地址，例如 `https://api.example.com`（不要以 `/` 结尾）。  
   前端会请求 `apiBase + '/api/config'`、`apiBase + '/api/stats'` 等。

3. **上传**：将 `dist/` 内所有文件上传到静态主机或 CDN。

---

## 三、后端部署

1. **只部署 API**：进入后端目录并安装依赖、启动：
   ```bash
   cd server
   npm install
   npm start
   ```
   默认端口 3000，可通过环境变量 `PORT` 修改。  
   数据文件为 `server/data/store.json`（首次运行自动创建，纯 JSON，无原生依赖）。

2. **生产环境建议**：
   - 使用 pm2、systemd 等保活。
   - 如需限制跨域，设置环境变量 `CORS_ORIGIN` 为前端域名，例如：  
     `CORS_ORIGIN=https://你的前端域名`

---

## 四、弹幕配置（后端）

弹幕**默认不显示**，由后端配置控制。

- 接口：**GET /api/config** 返回示例：
  ```json
  {
    "danmakuEnabled": false,
    "danmakuPosition": "top"
  }
  ```
- 数据来源：`server/data/store.json` 中的 `settings` 对象：
  - `danmaku_enabled`：`"1"` 开启弹幕，`"0"` 关闭（默认）。
  - `danmaku_position`：弹幕区域位置，目前仅使用 `top`（顶部）。

**开启弹幕**：在部署后端的机器上任选一种方式：

1. 直接编辑 `server/data/store.json`，将 `settings.danmaku_enabled` 改为 `"1"`。
2. 或执行（需在 `server` 目录下）：
```bash
cd server
node -e "
const fs=require('fs'),path=require('path');
const p=path.join(process.cwd(),'data','store.json');
const s=JSON.parse(fs.readFileSync(p,'utf8'));
s.settings.danmaku_enabled='1';
fs.writeFileSync(p,JSON.stringify(s,null,0));
console.log('已开启弹幕');
"
```

前端会周期性/首次请求 `/api/config`，收到 `danmakuEnabled: true` 后显示顶部弹幕并拉取留言。

---

## 五、本地联合运行（不分离）

在项目根目录：

```bash
npm install
npm start
```

会同时提供静态资源与 `/api` 接口（根目录 `server.js` 挂载 `server/` 的 API），适合本地开发。此时 `api.config.json` 的 `apiBase` 保持为 `""` 即可。