# AI 视频生成模式总览

本文档汇总了 Tik-tok 项目内已落地的全部 AI 视频生成模式。整个系统借鉴 [Pixelle-Video](https://github.com/AIDC-AI/Pixelle-Video) 的多流水线架构，前后端均通过**插件式 Pipeline 注册中心**实现解耦：每新增一种模式 ≈ 1 个 Angular 独立组件 + 1 行注册元数据，无需改动主应用。

## 🗂 目录

1. [架构总览](#架构总览)
2. [六种生成模式](#六种生成模式)
3. [关键服务与接口](#关键服务与接口)
4. [新增 Pipeline 的方法](#新增-pipeline-的方法)
5. [开发与部署](#开发与部署)

---

## 架构总览

```
┌─────────────────────────────────────────────────────────┐
│                  生成模式中心（Hub）                      │
│       /src/app/pipelines/pipeline-registry.ts            │
└────────────────────┬────────────────────────────────────┘
                     ↓ *ngFor 动态渲染
┌─────────────────────────────────────────────────────────┐
│                 侧栏 / Hub 卡片网格                       │
└────────────────────┬────────────────────────────────────┘
                     ↓ setCurrentTab(route)
┌─────────────────────────────────────────────────────────┐
│  6 个独立 Standalone Angular 组件（按 currentTab 切换）  │
│                                                          │
│  ┌──────────┬──────────┬──────────┬──────────┐         │
│  │ 数字人    │ 标准重塑  │ 图生视频  │ 动作迁移  │ ...     │
│  └──────────┴──────────┴──────────┴──────────┘         │
└────────────────────┬────────────────────────────────────┘
                     ↓ 共享服务层
┌─────────────────────────────────────────────────────────┐
│   JimengService / LlmService / ResultsService /         │
│   composeVideoStream (SSE) / Volc TTS                   │
└─────────────────────────────────────────────────────────┘
                     ↓
┌─────────────────────────────────────────────────────────┐
│         server.js (Express + ffmpeg + Qiniu)            │
│  /api/remix/upload-asset       (Qiniu 七牛上传)          │
│  /api/video/composite          (ffmpeg 同步合成)         │
│  /api/video/composite/stream   (ffmpeg SSE 流式合成)     │
└─────────────────────────────────────────────────────────┘
```

**关键文件：**

| 文件 | 作用 |
|---|---|
| `src/app/pipelines/pipeline-registry.ts` | Pipeline 元数据注册中心，决定侧栏与 Hub 卡片 |
| `src/app/pipelines/composite-sse.ts` | fetch + SSE 客户端 helper |
| `src/app/services/jimeng.service.ts` | 即梦 API 封装（视频/图像/数字人/动作迁移） |
| `src/app/services/llm.service.ts` | LLM 对话封装 |
| `src/app/services/results.service.ts` | 结果库/历史持久化（带 pipelineId） |
| `src/app/pages/pipelines/<id>/*.component.ts` | 每种模式的独立 Angular 组件 |

---

## 六种生成模式

### 1️⃣ 数字人合成 (`digital_human`) — `stable`

> 上传形象图/参考视频 + 脚本，生成数字人口播视频。

- **后端 API**：即梦 OmniHuman `getOhIdentifyMain` → `getOmniHuman`
- **关键链路**：主体识别 → TTS 合成音频 → 数字人生成 → 轮询结果
- **计费**：¥1.0/秒
- **位置**：仍嵌在 `app.html` 主组件中（后续可抽出为独立组件）

### 2️⃣ 标准视频生成 (`video_generation`) — `beta`

> 上传原视频，AI 转录 + 改写 + 重新配音 + 配图后重新合成。

- **入口**：旧版 `vg-*` 流程，与新版生成模式并存
- **位置**：嵌在 `app.html` 主组件

### 3️⃣ 图生视频 (`image_to_video`) — `beta`

> 单张图（首帧）/ 双张图（首尾帧）/ 单图 + 运镜模板 → 动态视频。

- **后端 API**：即梦 v3 `getVideoV3_720p` / `getVideoV3_1080p` / `getVideoV3_Pro`
- **支持模式**：
  - **首帧** (`method='2'`)：720P / 1080P / Pro
  - **首尾帧** (`method='3'`)：仅 720P / 1080P
  - **运镜** (`method='4'`)：**仅 720P**，11 种官方模板：
    - hitchcock_dolly_in/out（希区柯克推进/拉远）
    - quick_pull_back（超级拉远）
    - crane_push（起重机）
    - robo_arm（机械臂）
    - dynamic_orbit / central_orbit（动感/中心环绕）
    - clockwise/counterclockwise_swivel（顺/逆时针回旋）
    - handheld（手持运镜）
    - rapid_push_pull（快速推拉）
- **统一入口**：`JimengService.generateImageToVideo(params)`
- **关键修复**：Pro 接口需顶层 `image_url` + 整数 `aspect_ratio` 1-6（与 720P/1080P 入参不同），已通过 `generateVideoPro` 适配
- **计费**：720P ¥0.28/秒，1080P ¥0.63/秒，Pro ¥1.0/秒
- **位置**：`src/app/pages/pipelines/image-to-video/`

### 4️⃣ 动作迁移 (`action_transfer`) — `beta`

> 角色图 + 参考视频 → 让角色按视频中的动作 / 表情 / 口型动起来。

- **后端 API**：即梦 `getActorV2`（动作模仿 2.0，支持多人 / 非真人驱动）
- **关键链路**：上传 → submit → `pollUntilComplete(workId, 'getActorV2')` → 取 `videos[0]`
- **关键调整**：服务端 multer `assetUpload` 上限从 50MB 提升至 **200MB** 以支持视频
- **计费**：¥0.4/秒
- **位置**：`src/app/pages/pipelines/action-transfer/`

### 5️⃣ 素材合成视频 (`asset_remix`) — `beta`

> 多张图片 + 主题 → AI 生成口播文案 → 火山 TTS 配音 → ffmpeg 拼接成片。

- **关键链路**：
  1. 多图上传到七牛云（`/api/remix/upload-asset`）
  2. `LlmService.chat()` 输出 JSON 文案数组
  3. 串行（`concatMap`）调火山 TTS `/tts/unidirectional` 生成每段 `audioUrl`
  4. `composeVideoStream`（SSE）→ ffmpeg 实时拼接
- **风格**：纪实 / 激情 / 故事 / 种草
- **位置**：`src/app/pages/pipelines/asset-remix/`

### 6️⃣ 主题生视频 (`topic_to_video`) — `beta`

> 一句话主题 → 全自动 4 阶段生成视频。

- **关键链路（一键启动）**：
  1. **Step 1 LLM 分镜**：拆分成 N 段 `{scene_prompt, narration}` JSON
  2. **Step 2 即梦 img-v4**：每段 prompt 文生图（串行避免限流）
  3. **Step 3 火山 TTS**：每段解说合成音频
  4. **Step 4 ffmpeg SSE 合成**：实时进度推送
- **风格**：电影感 / 写实 / 动漫 / 插画 / 纪录片（自动注入英文 prompt 后缀）
- **比例**：横屏 16:9 / 竖屏 9:16 / 方屏 1:1
- **容错**：单段失败自动跳过，仅当全部失败才 abort
- **总进度**：综合 4 阶段（分镜 5% + 图 45% + 音 20% + 合成 30%）
- **位置**：`src/app/pages/pipelines/topic-to-video/`

---

## 关键服务与接口

### JimengService 新增方法

```ts
// 统一图生视频入口，自动按 (method, quality) 路由 + 校验不兼容组合
generateImageToVideo(params: {
  imageUrls: string[];
  prompt: string;
  method: '2' | '3' | '4';
  quality: '720p' | '1080p' | 'pro';
  frames?: number;
  cameraTemplate?: JimengCameraTemplateId;
  cameraStrength?: 'weak' | 'medium' | 'strong';
  aspectRatio?: JimengAspectRatio;
}, onProgress?): Observable<{ videoUrl, workId }>

// 动作迁移
actionTransfer(imageUrl, videoUrl, { cutFirstSecond }, onProgress?): Observable<{ videoUrl, workId }>
```

### 后端 SSE 流式合成

```
POST /api/video/composite/stream
Content-Type: application/json
Body: { segments: [{ id, imageUrl, audioUrl }], title }
↓
事件流：
  event: stage    data: { stage, message }
  event: progress data: { stage, current, total, percent, message }
  event: done     data: { videoUrl, filename, size, segments }
  event: error    data: { error }
```

前端使用：
```ts
import { composeVideoStream } from '@/app/pipelines/composite-sse';
const handle = composeVideoStream({ segments, title, onProgress, onStage });
const result = await handle.promise;
// 可随时 handle.abort()
```

### 结果与历史

`ResultsService` (`src/app/services/results.service.ts`) 为所有新模式提供统一的结果库 / 历史持久化：

```ts
this.results.saveResult({ type: 'video', url, title, pipelineId: 'image_to_video', ... });
this.results.saveHistory({ keyword, status: 'completed', resultUrl, pipelineId, ... });
```

`GeneratedResult` 与 `HistoryRecord` 接口已添加 `pipelineId` 字段，后续可在结果库 tab 按模式筛选。

---

## 新增 Pipeline 的方法

1. **创建组件**：在 `src/app/pages/pipelines/<id>/` 新建 standalone Angular 组件
2. **注册元数据**：在 `pipeline-registry.ts` 的 `PIPELINES` 数组追加一项
   ```ts
   {
     id: 'new_mode',
     displayName: '新模式',
     description: '...',
     inputHint: '...',
     iconSvg: '<...>',
     route: 'new-mode',
     status: 'beta',
     showInSidebar: true,
   }
   ```
3. **扩展类型**：`pipeline-registry.ts` 的 `PipelineRoute` 联合类型加新 route
4. **注入主组件**：`app.ts` import + 加入 `imports` 数组
5. **接入路由**：`app.html` 加 `<app-new-mode *ngIf="currentTab === 'new-mode'">`
6. **类型联合**：`app.ts` 的 `currentTab` 联合 + `setCurrentTab`/`restoreCurrentTab` 签名同步
7. **持久化（可选）**：注入 `ResultsService`，在成功回调中 `saveResult` + `saveHistory` 带 pipelineId

---

## 开发与部署

### 启动开发环境

```powershell
# 后端（含 ffmpeg / Qiniu / SSE）
node server.js

# 前端
npm run start
```

打开 `http://localhost:4200`，侧栏点击 **生成模式** 进入 Hub 选择模式。

### 依赖

| 依赖 | 用途 |
|---|---|
| **ffmpeg** | 必须在系统 PATH（视频合成、音频提取） |
| **七牛云** | 公网素材存储（即梦 / 动作迁移要求公网 URL） |
| **即梦 token** | 视频 / 图像 / 数字人 / 动作迁移付费 API |
| **火山 TTS token** | TTS 配音 |
| **LLM** | DeepSeek/GPT/Claude，通过 `/api/llm/chat` 统一代理 |

### 上线检查清单

- [ ] `node server.js` 启动无报错
- [ ] 七牛 Access Key / Secret Key 配置正确
- [ ] 即梦 token 余额充足
- [ ] ffmpeg `ffmpeg -version` 可调用
- [ ] 前端 `ng build --configuration production` 无错误
- [ ] 进入 **生成模式** Hub，6 张卡片可见且状态正确
- [ ] 各 Beta 模式按指引可生成成片
- [ ] 结果库可见各 pipelineId 的记录

### 已知限制

| 限制 | 说明 |
|---|---|
| Pro 不支持首尾帧/运镜 | UI 已自动禁用，切换模式时回退到 720P/1080P |
| 运镜仅 720P | UI 已自动锁定 |
| TTS 串行 | 火山 API QPS 限制，串行更稳定 |
| 数字人 / 标准 AI 重塑仍嵌主组件 | 后续可抽出为独立组件以彻底解耦 |
| 结果库 UI 无模式筛选 | `pipelineId` 已落库，UI 筛选器可后续添加 |

---

## 致谢

本系统的多 Pipeline 架构设计借鉴 [Pixelle-Video](https://github.com/AIDC-AI/Pixelle-Video) 的双层抽象（`BasePipeline` + `PipelineUI`）与生成模式分类。