MatrixMedia 是一款开源的多平台视频矩阵发布工具,支持一键将内容同步到抖音、快手、百家号、B站、头条、视频号、小红书、番茄视频 8 大主流平台。
最近 MatrixMedia 连续迭代了 v0.10.0 ~ v0.10.2 三个版本,带来了两个值得关注的能力:B站封面自定义选择 和 二开指南 Tab 上线。前者解决了很多创作者在 B 站发布时封面不可控的痛点,后者则为想参与二次开发的开发者铺平了道路。下面逐一展开聊聊实现细节。
一、B站封面自定义:Puppeteer 自动化选择第一帧
如果你是 B 站创作者,一定知道封面对点击率的影响有多大。MatrixMedia 此前在 B 站发布时无法干预封面选择,这次 v0.10.0 补齐了这一能力。
实现思路
B 站的封面设置藏在视频上传完成后的编辑流程里,页面结构比较复杂。我们的做法是通过 Puppeteer 模拟用户操作,完成「进入封面设置 → 选择第一帧 → 确认」这一完整链路。
核心流程如下:
-
等待封面加载入口 --- 视频上传完成后,B 站页面会渲染封面编辑区域。使用
page.waitForSelector(".cover-empty.failed")等待封面加载节点出现,确保 DOM 已就绪。 -
打开封面设置弹窗 --- 点击「封面设置」按钮,触发 B 站的封面编辑弹窗。
-
选择第一帧 --- 在封面编辑弹窗中,默认滑块处于视频中间位置。我们通过 Puppeteer 的
mouse.move、mouse.down、mouse.up三个 API 组合,模拟用户将滑块向左拖拽 10px,使封面定位到视频的第一帧。 -
确认并完成 --- 使用
page.evaluate在页面上下文中查找「完成」按钮并触发点击,关闭弹窗,封面设置生效。
技术细节
js
// 核心拖拽逻辑示意(简化版)
// 1. 等待封面加载
await page.waitForSelector(".cover-empty.failed");
// 2. 点击封面设置入口
// ...
// 3. 模拟拖拽滑块选择第一帧
const slider = await page.$(".cover-edit-slider");
const box = await slider.boundingBox();
await page.mouse.move(box.x + box.width / 2, box.y + box.height / 2);
await page.mouse.down();
await page.mouse.move(box.x + box.width / 2 - 10, box.y + box.height / 2, { steps: 5 });
await page.mouse.up();
// 4. 点击完成按钮
await page.evaluate(() => {
const btns = [...document.querySelectorAll("button")];
const doneBtn = btns.find(b => b.textContent.includes("完成"));
if (doneBtn) doneBtn.click();
});
这里有一个值得注意的细节:B 站的「完成」按钮是通过 evaluate 在页面上下文中查找的,而不是直接用固定的 selector。这是因为 B 站的弹窗按钮 class 名经常变化,用文本内容匹配更稳健。
同时,这个版本也去除了视频号标题的字符上限限制,适配了更长的标题需求。
二、二开指南 Tab:为零门槛贡献铺路
v0.10.2 上线了项目详情页的 Tab 切换功能,新增「快速开发新平台」标签页。这意味着任何开发者都可以在项目内直接查看完整的二次开发教程,无需跳出到外部文档。
8 步完整教程
二开指南覆盖了从零开始接入一个新平台的全部流程,共 8 个步骤:
| 步骤 | 内容 | 说明 |
|---|---|---|
| 1 | 环境准备 | 克隆项目、安装依赖(yarn install),启动开发模式(yarn dev) |
| 2 | 平台配置(2个文件) | 在 configUrl.js 中定义平台 URL 和发布入口 |
| 3 | 上传逻辑 | 基于 Puppeteer 模板编写 mypt.js,实现自动化上传流程 |
| 4 | 发布状态获取 | 处理上传后的状态回调,确保发布结果可追踪 |
| 5 | 平台图标 | 为新增平台添加 UI 图标资源 |
| 6 | 渲染层工具 | 注册到渲染进程的平台工具集 |
| 7 | CLI 支持 | 让新平台支持命令行调用 |
| 8 | MCP 支持 | 接入 MCP 协议,支持 AI Agent 调用 |
代码模板即文档
二开指南不只是文字说明,还附带了完整的代码模板。比如平台 URL 配置:
js
// configUrl.js 配置示例
{
name: "mypt",
label: "我的平台",
loginUrl: "YOUR_PLATFORM_LOGIN_URL",
publishUrl: "YOUR_PLATFORM_PUBLISH_URL",
// ...
}
以及上传逻辑模板 mypt.js 和 upLoad/index.js 中的注册方式,开发者只需按模板填充自己的平台逻辑即可。
视频管理页新增 Star 入口
除了二开指南,v0.10.2 还在视频管理页的 toolbar 增加了一个 ⭐ GitHub Star 按钮,方便用户一键跳转到项目仓库。这个小小的改动,对开源项目的传播和社区增长来说是个很实用的细节。
写在最后
MatrixMedia 的这次更新,一边补齐了 B 站封面的自动化能力,让创作者发布体验更完整;一边通过二开指南降低了贡献门槛,让有兴趣的开发者可以快速上手。作为一个持续迭代中的开源项目,这两个方向------功能深度 和社区友好度------都是长期健康发展的关键。
如果你对多平台视频发布有需求,或者对 Electron + Puppeteer 自动化感兴趣,欢迎来项目仓库看看:
觉得有用的话,别忘了点个 Star ⭐