dsh-media-viewer:在 DSH 右侧栏预览视频、音频与 HTML

前言

在 DeepSeek Harness(DSH)里做前端或内容类任务时,工作区里常有 .mp4、.wav、.html 等文件。默认文件预览对这类资源支持有限,常见结果是「无法预览」或只能下载,智能体和你都要靠外部播放器或浏览器另开标签页核对效果。

DSH 生态按「一切皆插件」扩展能力;社区目录(例如 SkillHub)收录第三方插件,与 DeepSeek / 幻方无官方从属关系。下面介绍维护者 VibeDev-Si 发布的客户端插件 @vibedev-si/dsh-media-viewer:在 DSH 自带右侧栏里内联播放媒体、渲染 HTML,并提供文件夹级媒体画廊。

这是什么

dsh-media-viewer 是 DSH 的 Web UI / 客户端 插件,npm 包名为 @vibedev-si/dsh-media-viewer。它在右侧栏直接预览视频、音频和 HTML,并提供文件夹媒体画廊;若已安装 dsh-better-sidebar,播放器也会注册进该侧栏编辑器,画廊入口仍共用同一套逻辑。

公开仓库:github.com/VibeDev-Si/dsh-media-viewer(目录页星标为 0)。当前 marketplace 收录版本为 0.2.1,许可证 MIT。

核心功能

下面能力均来自插件 README(经 dsh marketplace 核验)。

视频与音频

  • 视频:支持 mp4 / webm / mov / mkv 等;可拖进度条,倍速、循环;通过 HTTP Range 流式传输,不限文件大小。
  • 音频:支持 mp3 / wav / m4a / flac 等;实时频谱;倍速、循环。

HTML 预览

  • 默认允许脚本;相对路径的 CSS、JS、图片、视频及 fetch 可加载。
  • 支持预览 / 源码切换,以及手机、平板、桌面视口宽度;工具栏可开关脚本。
  • HTML 在不透明来源的沙箱 iframe 中运行(无 allow-same-origin),降低对 GUI 的访问风险。

媒体画廊

  • 缩略图网格;按视频 / 音频 / 图片 / 网页筛选、搜索、排序;可包含子文件夹。
  • 灯箱浏览支持上一个 / 下一个(← →)。
  • 加入画布:画廊中「多选」勾选媒体后,可加入 影视工作台(dsh-film-studio)当前画布;未安装工作台时界面会提示。与工作台通过页面事件 vibedev-film:add-media 协作,文件复制到项目 assets/ 并在画布中排布。

/mp 路由

DSH 自带预览会整文件读取;dsh-better-sidebar 的 /sidebar/file、/sidebar/html 有 20MB 上限且不支持 Range。本插件提供 /mp/* 路由,便于大视频 seek、以及带脚本与子资源的 HTML 在沙箱内完整加载。

自 0.2.0 起,预览器与画廊主要挂在 DSH 自带右侧栏(需 DSH 0.2.1-alpha.2 及以上),不再硬依赖 dsh-better-sidebar。

安装与启用

宿主版本:需要 DSH 0.2.1-alpha.2 或更新(文档称 VibeDev Next 已满足)。除可选的 dsh-better-sidebar 与可选的 dsh-film-studio(仅「加入画布」)外,不强制其他插件。

  1. 在 DSH 插件管理界面按包名 @vibedev-si/dsh-media-viewer 安装,或
  2. 在终端用 profile 安装(将 <你的 profile 名> 换成实际 profile):
dsh plugin --profile <你的 profile 名> add @vibedev-si/dsh-media-viewer

安装后刷新页面。若曾安装无作用域旧包 dsh-media-viewer(0.1.0),请卸载后改装 @vibedev-si/dsh-media-viewer。

marketplace 还提供简写示例 dsh plugin add @vibedev-si/dsh-media-viewer;是否适用取决于你的 DSH 版本与默认 profile,以官方安装说明为准。可用 dsh --profile default --dump-config 确认插件层是否生效。

典型用法

单文件预览

  1. 在文件树中打开视频、音频或 HTML 文件,默认走本插件播放器。
  2. 若需切回内置预览,在文件预览顶部切换菜单中选择。

打开媒体画廊

  • 右侧栏「开始」页的「媒体画廊」;
  • 文件树顶部的「媒体画廊」(当前文件夹);
  • 文件预览顶部的「画廊」(文件所在文件夹)。

与工作台联动

  1. 启用 dsh-film-studio 并在侧栏打开画布。
  2. 在画廊进入「多选」,勾选图片 / 视频 / 音频(支持 Shift 连选、全选)。
  3. 点击「加入画布」。

预览不可信 HTML 时,建议关闭工具栏「脚本 开」。

适用场景与注意

适合谁

  • 经常在 DSH 工作区内查看样片、播客素材、原型 HTML 的开发者或智能体操作者。
  • 需要在同一界面浏览文件夹内大量媒体、再批量送入影视工作台的用户。

安全与权限

  • 插件在 当前 dsh 进程权限 下运行,会向 Web 服务注册 /mp/* 等路由;安装前请阅读 GitHub 源码 与 MIT 许可证。
  • 路径限制在当前会话工作目录内;Host 需为回环或受信任主机。HTML 默认允许脚本,仅预览可信内容,或手动关脚本。
  • 社区目录页:SkillHub - dsh-media-viewer。

已知限制(README)

  • HTML 根相对路径(如 /logo.png)会指向 GUI 服务器根,应改用相对路径。
  • H.265 / HEVC 等浏览器不支持的编码无法播放,会提示并给出下载链接。
  • 画廊单次最多 3000 个文件,递归最深 6 层,跳过 node_modules 与 .git。
  • 文档注明主要在 Windows 测试,macOS / Linux 尚未实机验证。

结尾

@vibedev-si/dsh-media-viewer 把视频、音频、HTML 和文件夹画廊收进 DSH 右侧栏,减少来回切换外部工具的成本;大文件与复杂 HTML 则通过 /mp 路由和沙箱预览补齐宿主默认能力的缺口。

羽毛球分组比赛记分
小程序二维码

欢迎使用《羽毛球分组比赛记分》微信小程序

Xiaoye