介绍一下自己写的开源音乐服务「知了」

[jfv]

「知了」是一个开源的音乐服务, 可以部署在任何 Linux/Windows/macOS 设备上, 主要有以下特点:

完全开源和数据完全掌控

知了分为服务端和客户端, 代码完全开源. 知了上的数据完全保留在本机, 包括数据库(Sqlite). 迁移服务只需要将知了的数据目录迁移即可.

支持 PWA, 媲美原生应用

PWA 是一种可以将 Web APP 安装到本地的一种技术, 安装之后可以像原生应用出现在系统的应用列表中, 并且启动后有独立的应用窗口. 当然, PWA 能做的不仅仅这些, 不过篇幅过长这里就不再概述了.

PWA 仅支持 HTTPS 或者 localhost, 知了目前暂不支持配置 HTTPS, 请使用 nginx 之类的工具进行 HTTPS 反向代理.

还算可以的 UI 设计以及适配移动端

因为我本身也不是设计出身, 也没什么设计天赋, 所以知了的 UI 都是按照自己的喜好还有参考其他应用设计出来的, 自以为 UI 上还过得去.

此外还在桌面端的基础上适配了移动端.

支持离线访问

得益于 PWA, 知了会把加载过的资源缓存在本地, 即使在断网情况下, 依然可以播放和查看已缓存的数据.

系统媒体支持

知了已接入系统媒体, 能够在操控台看到当前正在播放的音乐, 以及使用系统快捷键 /键盘快捷键进行操作.

多歌词支持

多用户

知了对用户数量没有限制, 只要你愿意就可以将知了服务分享给好友使用.

如何部署

知了的部署也很简单, 需要准备一个邮箱用于发送邮件, 因为知了的登录和其他部分服务需要依赖邮箱, 将邮箱信息填写到 JSON 或者 JSON5 格式的配置文件中:

{
  "emailHost": "smtp.example.com",
  "emailUser": "example",
  "emailPass": "example-password"
}

然后从 Releases 页面下载并解压对应平台的包或者自行编译, 使用如下命令启动(以 x64 Linux 为例):

./cicada-linux-x64 start -c path_to/config.json

首次运行知了会要求输入管理员邮箱进行初始化, 初始化完成后访问 localhost:8000 或者 {{ip}}:8000 就可以访问了.

当然, 首次登入到知了是没有任何数据, 可以前往「我的音乐」页面创建新的音乐, 创建后就可以随时随地地畅听了.

起源

接下来说一下为什么会有「知了」这个项目.

曾几何时我也是使用在线音乐服务的, QQ 音乐和网易云音乐我都曾经是会员, 当时只要开通了会员, 你就可以听到任何你想听到的音乐. 后面随着版权大战, 收藏列表的音乐每天都有变灰的, 最夸张的是我的一个歌单三百首竟然灰了一百多首(知了没有使用第三方音乐源的原因).

在线音乐服务能听的歌越来越少是主因, 还有一些其他原因, 比如网易云音乐的播放列表限制一千首(从产品和技术角度我都不明白为什么有这个限制), QQ 音乐中的各种广告(会员还要给我看广告?)以及使用习惯等等.

最开始的知了其实是由 electron 开发的一个单机应用, 有次同学看到我在使用知了并且对知了很感兴趣, 我给了他一份副本, 他使用几天后感觉还可以然后也提出了他的建议"这玩意能做成多端同步吗?"

因为当时我是使用第三方应用在多台电脑进行音乐文件同步的, 如果我把知了做成多端同步不就不需要第三方同步应用了吗? 但是多端同步的实现复杂性和安全性都是个很大的问题, 所以退而求其次我选择了 C/S 架构, 多个客户端连接一个服务端从而省略了多端同步.

这一版的知了积累了二十多个用户后, 有一天有个同学问我"这东西可以做成开源的吗? 这样我也能部署一个". 于是我听从了他的建议才有了现在的知了.

当然知了的开发也不是一路顺风, 我也从中学到了很多新的技术. 比如当初知了是分为 server / pwa / electron 三个项目的, 后面接触到了 monorepo, 于是就有了现在合并后的 cicada 项目. 再比如有 electron 客户端是因为我想全局快捷键下实现播放/暂停/上一首/下一首操作的, 后面解到 Media Session API, 发现接入系统媒体后就不需要全局快捷键了, 所以就把 electron 客户端干掉了.

从知了学到的远远不止这些, 比如 clrc 这个包, 就是为了解析 LRC 格式提炼出来的, 还有:

• react-lrc, 用于展示 LRC 格式歌词的 React 组件
• react-media-session(已归档), 用于配置 Media Session 的 React 组件
• eventin, 支持 TypeScript 类型约束的事件触发器
• x-state, React 状态管理工具

虽然知了已经开发很多年了, 但是仍然处于一个起步阶段, 还有很多方面要完善, 比如:

• 现在 PWA 在移动平台的体验还很差, 所以的话后续打算开发 iOS/Android 客户端
• 提供 Docker 镜像, 更方便地部署
• 开发电台功能, 随机播放音乐, 不用纠结到底要听什么了
• ...

当然, 后续开发的前提是知了得有人用, 所以欢迎大家来使用知了, 使用过程中有问题或者建议的话可以通过 Issues 进行反馈.

更多

• 项目地址: https://github.com/mebtte/cicada
• 问题反馈: https://github.com/mebtte/cicada/issues

[jfv]

图片加载不出来的话可以访问原文
https://mebtte.com/introducing_cicada

[kawei]

这个邮箱直接难住我了.. 有没有 demo 阿

[SenLief]

音源需要自建还是自带的？

[jfv]

@SenLief 需要自己创建 保存在自己的机器

[jfv]

@kawei 用 qq 126 163 这些邮箱都可以 就跟登陆第三方邮箱客户端一样

[novolunt]

可以使用 tauri 统一做成各个平台 app ，主要还是音乐源，可以用当年网易的手段，到 pt 网站下

[needpp]

赞一个

[MeteorVIP]

我没上过学，所以想问：歌曲是存在自建的服务器上吗？

[jfv]

@novolunt 音乐源的话依靠第三方总是靠不住 说不定哪天就没了 还是保存在自己的硬盘才是最稳妥的

[jfv]

@novolunt 我现在的方式是写脚本从第三方下载并上传到知了 不过脚本涉及到版权问题 不好开源

[jfv]

@MeteorVIP 是的 音乐文件保存在自己的硬盘上

[novolunt]

@jfv 使用 tor 的方式，有版权问题的，没有更好的办法。参考 zlibrary

[subframe75361]

不是很理解为什么选择邮件服务器这种方式，官网的验证码 404 ，windows 本机上试了一下，如下结果

--- config | mode = production ---
--- config | initialAdminEmail = ---
--- config | data =***\cicada/cicada ---
--- config | port = 8000 ---
--- config | emailHost = localhost ---
--- config | emailPort = 465 ---
--- config | emailUser = test ---
--- config | emailPass = **** ---

错误日志：
[23:03:03] /login_code
Error: connect ECONNREFUSED 127.0.0.1:465
at TCPConnectWrap.afterConnect [as oncomplete] (node:net:1187:16)

配置：
{
"emailHost": "localhost",
"emailUser": "test",
"emailPass": "test"
}

[jfv]

@subframe75361 官网只是一个单纯的前端页面 没有部署后端

邮箱服务指的是发送邮件服务 因为登录的时候是将登录验证码发送到你的用户邮箱的

[ayamir]

没有成功运行，有 4 个问题：
1. 第一次运行打开网页输入的邮箱和 config.json 里面写的邮箱是什么关系？
2. 网页中的设置里面的服务器源地址是什么意思？
3. 使用 gmail ，保持网页输入的邮箱和 config.json 中的邮箱一致，错误日志如下，但是我已经使用 tun mode ，按理说无论怎样都能访问到 google ，但是还是会报服务器错误。
[00:27:05] /login_code
Error: Client network socket disconnected before secure TLS connection was established
at connResetException (node:internal/errors:692:14)
at TLSSocket.onConnectEnd (node:_tls_wrap:1587:19)
at TLSSocket.emit (node:events:539:35)
at endReadableNT (node:internal/streams/readable:1345:12)
at processTicksAndRejections (node:internal/process/task_queues:83:21)

4. 我换用 qq 邮箱执行 2 里面的操作会在网页报参数错误，日志中没有新的记录，这是为什么？

[ayamir]

@ayamir 执行 3 里面的操作

[fwz233]

如果要做安卓端的话
可以基于这个开源项目实现吧 https://github.com/rRemix/APlayer

[rainhabitoops]

跟那个什么什么酷狗什么东西的蛮像的。

[Kenny]

看着不错，有时间研究一下。

[Spoter]

cool 已 star

[Acoffice]

怎么打包 arm 平台的二进制?

[jfv]

@Acoffice 只能在 arm 平台下打包 跨平台打包这个我已经在研究了 可能后续会支持

[jfv]

@ayamir emailHost/emailUser/emailPass 指的是发送邮件服务, 一般的话是使用第三方邮箱服务, 比如 qq/163 这些, initialAdminEmail 和首次运行提示输入的邮箱是同一个万一, 指的是第一个管理员用户, 打开页面登录的话用的就是这个邮箱

[Acoffice]

@jfv #22 那意思是 arm 下打包的,window 和 macos 也都是 arm 版本的?

[jfv]

@Acoffice 比如在 arm linux 下打包, 打包出来的会有 arm linux/arm macos/arm windows 三个包, 但是只有 arm linux 的是可用的, macos 和 windows 因为缺少 macos sqlite 和 windows sqlite, 这两个包是无法正常运营的, 目前我在研究能不能动态下载对应平台的 sqlite, 这样就可以支持跨平台打包了

[Acoffice]

@jfv #25 那可以下载所有的 sqlite 包或者加个判断通过获取系统架构来获取对应版本的 sqlite 包.

[jfv]

@Acoffice 我也试过这个方法 不过构建出来的包体积会很大

[Ccf]

mark ，现在用 navidrome 挺好

[jpyl0423]

先 mark ，感觉以后会用到

[feller]

老哥你博客用什么什么字体？不错

[jfv]

@feller 具体叫什么名字忘记了, 不过字体文件在这里
https://github.com/mebtte/animal-photosynthesis/tree/master/src/static

[shadoworld]

歌曲资源放在 googledrive 通过 rclone 挂载在服务器，可行吗？不然没那么大硬盘的服务器

[jfv]

@shadoworld 可以的 挂载成本地目录就可以了

[Acoffice]

@ayamir #15 我试过了,任何邮箱的 smtp 都没用(前端全部 200,然后网页报参数错误#1001,然后前台和后台无任何日志打印),
所以程序本身就有问题......
坑我帮你们踩过了,看楼主什么时间修复把.

[gclm]

有批量导入的 api 或者脚本吗？我已经搭建成功了。手动导比较麻烦，有相关 api 或者脚本吗？减少这个过程时间

[Acoffice]

@gclm #35 请问你是如何搭建成功的,为啥我的一直都是参数错误,也不清楚哪里问题

[jfv]

@Acoffice 可以看一下日志吗? 日志在 `data --> logs` 以 `server_error` 开头的

[jfv]

@gclm 有 postman 的 api 文档, 我可以整理之后发一下, 这样就可以通过脚本调用 api 批量导入了

[jfv]

@Acoffice 我 review 了一下代码 登录用的邮箱没有创建用户的就会报参数错误 你可以确认一下用户是否已经被创建

[Acoffice]

@jfv #39 嗯 我知道原因了,是因为 initialAdminEmail 这个变量值,在首次输入错误之后,后续改变此值就无效了.
导致我的数据库一直是错误的值,也没有明显的错误提示,导致一直未发现是哪里的问题.

[perfectlife]

音乐格式感觉可以多支持点啊

[jfv]

@perfectlife 要浏览器支持的格式才可以

[vcan]

感谢作者贡献。说句话，为啥要使用邮箱才能使用？为了这个，还要去弄个还要弄个 smtp 服务。再说了，邮箱安全问题呢？放弃！

[jfv]

@vcan
1. readme 说了使用邮箱的原因 [https://github.com/mebtte/cicada#%E5%87%86%E5%A4%87]( https://github.com/mebtte/cicada#%E5%87%86%E5%A4%87)
2. smtp 服务可以用第三方的, 比如新注册一个 126/163/qq, 这些都是免费的
3. 源码都在 github 上, 觉得有安全问题可以审查源码

[vcan]

@jfv 感谢回复，安全问题不一定是源码。毕竟邮箱信息明文保存的本地，打开一看就知道了。不过还是值得尝试使用一下。

[jfv]

@vcan 我接触到的商用或者私人项目配置都是明文配置的, 只要你的主机不被入侵没人能看到

或者说配置文件你有什么密钥加密的方案, 我可以尝试实现一下