MatrixMedia v0.10.x 更新:B站封面自定义 + 二开指南,开源项目的开发者体验再升级

MatrixMedia 是一款开源的多平台视频矩阵发布工具,支持一键将内容同步到抖音、快手、百家号、B站、头条、视频号、小红书、番茄视频 8 大主流平台。

最近 MatrixMedia 连续迭代了 v0.10.0 ~ v0.10.2 三个版本,带来了两个值得关注的能力:B站封面自定义选择二开指南 Tab 上线。前者解决了很多创作者在 B 站发布时封面不可控的痛点,后者则为想参与二次开发的开发者铺平了道路。下面逐一展开聊聊实现细节。


一、B站封面自定义:Puppeteer 自动化选择第一帧

如果你是 B 站创作者,一定知道封面对点击率的影响有多大。MatrixMedia 此前在 B 站发布时无法干预封面选择,这次 v0.10.0 补齐了这一能力。

实现思路

B 站的封面设置藏在视频上传完成后的编辑流程里,页面结构比较复杂。我们的做法是通过 Puppeteer 模拟用户操作,完成「进入封面设置 → 选择第一帧 → 确认」这一完整链路。

核心流程如下:

  1. 等待封面加载入口 --- 视频上传完成后,B 站页面会渲染封面编辑区域。使用 page.waitForSelector(".cover-empty.failed") 等待封面加载节点出现,确保 DOM 已就绪。

  2. 打开封面设置弹窗 --- 点击「封面设置」按钮,触发 B 站的封面编辑弹窗。

  3. 选择第一帧 --- 在封面编辑弹窗中,默认滑块处于视频中间位置。我们通过 Puppeteer 的 mouse.movemouse.downmouse.up 三个 API 组合,模拟用户将滑块向左拖拽 10px,使封面定位到视频的第一帧。

  4. 确认并完成 --- 使用 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.jsupLoad/index.js 中的注册方式,开发者只需按模板填充自己的平台逻辑即可。

视频管理页新增 Star 入口

除了二开指南,v0.10.2 还在视频管理页的 toolbar 增加了一个 ⭐ GitHub Star 按钮,方便用户一键跳转到项目仓库。这个小小的改动,对开源项目的传播和社区增长来说是个很实用的细节。


写在最后

MatrixMedia 的这次更新,一边补齐了 B 站封面的自动化能力,让创作者发布体验更完整;一边通过二开指南降低了贡献门槛,让有兴趣的开发者可以快速上手。作为一个持续迭代中的开源项目,这两个方向------功能深度社区友好度------都是长期健康发展的关键。

如果你对多平台视频发布有需求,或者对 Electron + Puppeteer 自动化感兴趣,欢迎来项目仓库看看:

👉 github.com/hanliang97/...

觉得有用的话,别忘了点个 Star ⭐

相关推荐
JackieZhengChina2 小时前
image-viewer-js 开源图片查看插件完整教程
开发语言·javascript·开源
带娃的IT创业者2 小时前
从 iptv-org/iptv 看开源协作:如何像 AI Agent 一样思考工程化实践
人工智能·开源·github·软件开发·ai agent·工程化实践·开源协作
wangruofeng12 小时前
81 位 GitHub Stars 校友的作品与共同点:影响力来自长期公开建设
开源·github
冬奇Lab13 小时前
开源项目第158期:cangjie-skill — 把书、视频、播客里的方法论蒸馏成可调用的 AI Skills
人工智能·开源·资讯
习明然14 小时前
我的本地化AI项目(三)
人工智能·python·electron·c#·avalonia
皮皮狗工坊18 小时前
为了让媳妇儿无痛用上 Fable 5,我做了个 Chatbot
开源
iCOD3R1 天前
【趣站精选】2026-07-13
开源·html
狂师1 天前
端开发必装 Skill 清单:6 款 AI 技能,让你的开发效率原地起飞
前端·程序员·开源