feat(posts): add 3 video automation posts (EN+ZH) backdated into 2025 archive gaps with full artwork suite

src/content/posts/zh/how-i-built-an-automated-music-video-pipeline.md

@@ -0,0 +1,121 @@
+---
+title: "我是如何用 Remotion 与 Docker CDP 打造全自动 MV 生成与多语种油管发布流的"
+description: "从纯音频与歌词到 1080P 高清成片上架并同步发布 8 语字幕的全自动流水线。详解 Remotion 视频合成、Whisper 声学词首微秒对齐与 Docker CDP 发布实战。"
+pubDate: 2025-04-18
+updatedDate: 2026-10-22
+category: case-studies
+tags: ["remotion", "docker", "cdp", "youtube", "automation", "video-generation", "whisper"]
+ogImage: "/og/zh-how-i-built-an-automated-music-video-pipeline.jpg"
+banner: "/banners/how-i-built-an-automated-music-video-pipeline.jpg"
+draft: false
+---
+
+绝大多数 AI 音乐制作流程在生成完音频文件后都会陷入停滞。你手里有一份 MP3 文件和一段纯文本歌词。如果想把它做成能在 YouTube、Bilibili 或各大社交平台上发布的成品视频，通常需要经历漫长而繁琐的手工流程：打开剪辑软件、裁剪背景画面、逐行拉字幕调关键帧、导出几个 G 的庞大文件、守着浏览器上传、手动填写封面与标签、再手动复制粘贴字幕文件。
+
+做一首歌可能要耗费大半天，如果有几十首歌曲库，这种手工做法完全无法规模化。
+
+我需要一条纯自动化的工业级管线：只需丢入音频文件与歌词，离开工位。三分钟后，一段 1080P 高清 MV 视频即渲染完成，自带跟随音乐动态律动的音频动效环、高精度三行滚动歌词、智能分镜人物避让切换，并全自动通过远程 CDP 发布到 YouTube，挂载自定义封面与 8 种语言的外挂同步字幕。
+
+以下是整套系统的架构设计、核心踩坑点与线上实战方案。
+
+---
+
+## 1. 整体系统架构
+
+整个自动化系统分为四个完全解耦的层级：
+
+```
+[原始 MP3 音频 + 文本歌词]
+        │
+        ▼
+1. 声学起唱对齐（Whisper 词级微秒时间戳 -> 校准 LRC + SRT）
+        │
+        ▼
+2. 动态 React 视频合成（Remotion 1080P 30fps）
+   ├─ 动态环形音频动效（320px 基础半径 -> 380px 低频弹性外扩 + 72 根跳动频谱柱）
+   ├─ 三行平滑滚动歌词（留白侧智能滑动与人物避让）
+   └─ 纯净透明度叠化背景（1.8s 贝塞尔曲线过渡，彻底杜绝抖动）
+        │
+        ▼
+3. 容器免鉴权落盘（Portainer Docker Archive API -> 容器 /config/Downloads）
+        │
+        ▼
+4. YouTube 自动化发布（远程 Chrome DevTools Protocol / Playwright）
+   ├─ 自动挂载视频与封面 cover.jpg
+   ├─ 自动填充标题、简介、SEO 标签与官网/业务联络方式
+   ├─ 穿透发布向导，选择公开（Public）发布
+   └─ 调度大模型翻译并自动挂载发布 8 国外挂字幕（英、日、韩、西、法、德、马、繁中）
+```
+
+---
+
+## 2. 解决歌唱声学字幕对齐难题
+
+AI 歌唱音频中普遍存在拖音、转音、颤音和节奏弹性拉伸。如果直接用常规语音转写工具识别，伴奏强烈的鼓点和乐器声往往会导致整句唱词被漏掉。
+
+为了实现微秒级咬字对齐，管线采用了**基于已知歌词的声学起唱对齐（Forced Acoustic Onset Alignment）**：
+1. 以人工确认的标准歌词作为基准锚点；
+2. 调用本地 `faster-whisper` 并开启词级时间戳（`word_timestamps=True`）；
+3. 针对每行歌词，锁定首字真实发音起振的能量起跑点，校准字幕起止点。
+
+这样产出的 `.lrc` 与 `.srt` 具备声学校准精度，无论歌手怎么拖长音，高亮提示总是在唱出第一个辅音的瞬间精准点亮。
+
+---
+
+## 3. Remotion 留白侧人物避让算法
+
+在采用插画背景的 MV 中，一个常见痛点是歌词遮挡画面主角。如果某一镜小仙女画在画面右侧，歌词依然居中或靠右就会直接盖在人物脸上。
+
+为了从根本上规避遮挡，管线引入了 `sides.json` 留白侧定义文件：
+
+```json
+["left", "right", "left", "right", "left", "right", "left", "right"]
+```
+
+在 Remotion 合成组件（`MusicVideo.tsx`）中，音频环与歌词容器由统一的动态坐标驱动：
+
+```tsx
+const getSideX = (idx: number) => {
+  const side = sides[idx] || (idx % 2 === 0 ? 'left' : 'right');
+  return side === 'left' ? 540 : 1380;
+};
+```
+
+在每张分镜结束前的 1.8 秒内，歌词与音频环使用贝塞尔缓动平滑横向滑移。在下一张图片淡入之前，文字已平稳就位在留白侧，右侧人物与景物 100% 毫无遮挡。
+
+---
+
+## 4. 远程 YouTube CDP 上传通道
+
+视频在本地 Windows 工作站上渲染，而已登录 YouTube 账号的浏览器运行在 DSM NAS 上的独立 Docker 容器（`chrome2`）中。
+
+为了无需人工扫码或重新授权即可完成上架：
+1. **Docker 归档落盘**：130MB 的 MP4 视频与封面图片通过 Portainer REST API 打包成 tar 流直接 PUT 写入容器文件系统（`/config/Downloads`），2 秒内完成落盘，彻底规避 CDP 协议的内存上限；
+2. **CDP 节点注入**：通过 Playwright 接入 CDP（`ws://192.168.1.1:9242`），直接向 DOM 的文件输入节点注入容器路径：
+
+```python
+cdp.send("DOM.setFileInputFiles", {
+    "files": ["/config/Downloads/国风电子 糖画小仙.mp4"],
+    "nodeId": video_node["nodeId"],
+})
+```
+
+3. **多语种字幕调度**：字幕翻译自动化脚本将基准 SRT 提取为纯文本行数组，通过本地 OmniRoute 大模型网关翻译为 8 种语言，并调用 CDP 遍历 YouTube Studio 后台，自动创建语言并发布所有外挂字幕轨。
+
+---
+
+## 5. 经验与教训
+
+- **渲染与发布必须解耦**：早期版本尝试过一边渲染一边推流或直接向浏览器传 buffer，编码器稍有波动就会导致浏览器连接重置。先在磁盘写出完整 MP4 再通过归档传输，两道环节互不牵连，容错率极高。
+- **合成前必须进行九宫格审查**：正式渲染全片前，先生成一张全分镜缩略拼图快速校验，肉眼确认每一张图的留白侧标记完全吻合，避免全片渲染数分钟后才发现有一处文字挡了人物。
+
+---
+
+## 想为你的业务打造类似的系统吗？
+
+我专注于自动化音视频制作管线、AI 音乐与多媒体创作流，以及基于 Docker / NAS 的自托管自动化基础设施搭建。
+
+无论你是需要自动化媒体制作系统，还是需要定制全栈软件工具：
+- **WhatsApp**: [直接在 WhatsApp 上联系我](https://wa.me/60127972969)
+- **邮箱**: [[email protected]](mailto:[email protected]?subject=自动化视频管线合作咨询)
+- **官网**: [hoelee.com](https://www.hoelee.com/)