DSH Music Player: Play Local Music Library via Web UI

前言

在 DSH 里写提示词、跑会话时,很多人习惯开系统播放器或浏览器标签页放歌。歌和会话分在两个窗口,切面板时还要自己记住进度。社区插件 dsh-music-player(维护者 daKeLinya0001,GitHub 仓库 daKeLinya0001/dsh-music-player,当前版本 1.1.0,MIT)把播放器和曲库嵌进 DSH Web UI:音频落在浏览器 IndexedDB,不上传外部服务,切换侧边栏面板时播放可继续。下文按「是什么 → 能做什么 → 怎么装 → 怎么用 → 注意点」说明。

插件定位

这是一个运行在 DSH Web UI 中的本地音乐播放器 bundle,包名为 @dakelinya0001/dsh-music-player。客户端逻辑集中在 client.js,通过 Cordis slot 注册侧边栏入口和主面板;Host 侧 index.js 为空实现。插件在 SkillHub 目录中归类为「联网工具」,但从 README 描述看,其核心是本地导入与 Web Audio 播放,不连接音乐流媒体、不上传音频。

核心功能

音乐库与格式

  • 通过文件选择器导入,或把音频文件拖到播放器面板。
  • 曲库支持搜索、单曲删除;自动恢复上次播放曲目(不会自动开始播放)。
  • 数据保存在 IndexedDB(库名 dsh-music-player),刷新页面后仍保留;切换 DSH 其他面板时音乐继续播放。

支持的扩展名包括:MP3、M4A、AAC、WAV、FLAC、OGG、OGA、Opus、WEBA、WebM、AIFF/AIF、ALAC、WMA。实际能否解码取决于当前 Chromium/Web Audio 对格式的支持。

播放控制

播放 / 暂停、上一首 / 下一首、进度条跳转、音量与静音,以及不循环、列表循环、单曲循环三种模式;界面显示当前时间与总时长。

界面与可视化

  • 右侧黑胶唱片与唱针动画(播放时唱片转动、唱针落下;暂停时缓慢停下并回位);唱片颜色、中心标签图可自定义,默认纯白标签。
  • 32 根实时音频频谱柱(AnalyserNode),可在播放器面板内显示,也可投射到会话工作区背景(pointer-events: none,不挡输入与点击)。
  • 「特效」页可统一调节唱片粒子、频谱柱粒子与光晕的数量、大小和颜色;粒子数量最高 200,文档注明可能影响性能。

设置与快捷键

全屏设置面板,选项自动保存。默认快捷键(仅在音乐播放器面板打开且焦点不在输入框等情况时生效):

快捷键 功能
Space 播放 / 暂停
A 上一首
D 下一首

可在设置中改键;暂不支持 Ctrl 等组合键。设置全屏打开时不会误触播放器快捷键。

安装与启用

前置条件

  • 已安装并启用 DSH,且当前使用 Web UI。
  • 浏览器支持 IndexedDB、Web Audio、backdrop-filter 和 color-mix。

获取源码

插件是本地 DSH bundle,仓库根目录即安装目标,无预编译构建步骤。可从 GitHub 页面 Code → Download ZIP 解压到本地;解压后包含 package.json 的那一层即为 target(若使用 Release ZIP,文档说明 music-player 目录亦可作为 target)。

装入 DSH

  1. 在 DSH 插件管理中选择从本地目录安装。
  2. target 指向仓库根目录(含 package.json)。
  3. 启用 bundle:@dakelinya0001/dsh-music-player。
  4. 刷新 DSH 页面。

也可通过 DSH 的 plugin_manager 工具:

action: install_bundle
target: <仓库根目录的绝对路径>

安装后确认该 bundle 在 Profile 的 bundle 列表中为启用状态。刷新页面后,点击左侧边栏音乐图标打开播放器。

典型用法

导入并播放

  1. 打开音乐面板,点击「导入音乐」选一个或多个文件,或直接拖入面板。
  2. 在曲库中点击曲目开始播放;底部「正在播放」区域可切换上下首、循环模式、进度与音量。

调整频谱与工作区背景

在右上角齿轮打开全屏设置。常用项包括:

  • 「律动频谱」:播放器面板内频谱柱开/关。
  • 「在工作区显示频谱柱」:会话背景频谱开/关(需有当前曲目且在会话工作区;位置可选输入框上方或紧贴底部)。
  • 频谱柱最大高度(默认 200,范围 0–300)、跳动速度(默认 35)、颜色与透明度等;每项可单独重置,也可一键「重置所有设置」(不删曲库、不改当前曲目与音量)。

自定义快捷键

设置中的「键盘快捷键」:点击对应按钮后按下新键即保存;若与另一动作冲突会自动交换。

适用场景与注意

适合谁: 希望在同一 DSH Web 界面内管理本地试听曲、长会话时保持背景音乐、并需要频谱与工作区氛围效果的用户。

数据与隐私: 不连接音乐服务、不上传音频;导入文件以 Blob 形式存在 IndexedDB。设置、音量、循环模式等轻量状态在 localStorage(键名前缀 dsh-music-player:)。清除站点数据、Profile 或 IndexedDB 会导致曲库丢失。

权限与安全: 插件以当前 DSH 进程/浏览器上下文运行;安装前应阅读源码与 MIT 许可证,仅从可信来源获取 bundle。package.json 中 private: false 表示未限制 npm 发布语义,与「从 GitHub 下载本地安装」并行说明于 README。

性能: 粒子总数、双 canvas 动画与 requestAnimationFrame 同在;低配机器可把「粒子数量」调低或关闭工作区频谱。

结尾

dsh-music-player 把本地曲库、播放控制和可视化收进 DSH 侧边栏,数据留在本机 IndexedDB,适合「边用 Harness 边听自己的文件」这类需求。更多信息见 SkillHub 目录页 与 GitHub 仓库(README 文档更新日期 2026-11-08)。

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

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

Xiaoye