做了个一站式 Bilibili 音乐下载器,以下是我的思考

2023-11-06 22:21:26 +08:00
 amber0317

👉立即试用: https://bili.amono.me/BV1Ag4y1b7pa (请使用支持 WASM 的现代浏览器)

我偶尔会在 B 站上听歌,因为很多唱见的翻唱都是只在 B 站投稿的,音乐软件不一定会及时更新。

如果每次打开网页听,又麻烦又费流量,搞不好还要给叔叔当 PCDN ;想方设法把视频存下来,在本地手动转音频,补上 ID3 标签和封面扔进收藏,这一整套忙下来,听歌的兴致早就没了。

于是我写了这个小工具帮忙。它提供一站式音乐下载服务:下载+转换+嵌入元数据/封面,整个流程浓缩在短短数十秒的浏览器会话中,无需任何手动干预,到手的文件可以直接丢进音乐库;而且借助 ffmpeg 和 WASM 的力量,所有的魔法都发生在浏览器里,下载和转换速度完全取决于你的网速与 CPU ,既做到了免安装,也省去了服务器维护和运行成本。


这算是我的独立开发生涯首作。简单分享一下设计和实现过程中的一些思路,希望能给你一些启发:

4603 次点击
所在节点    分享创造
57 条回复
huhexian
2023-11-06 22:24:57 +08:00
提个建议。不知道你这个工具面向什么人群,如果是普通用户,建议在网站里加一个输入 BV 链接的输入框,因为有些网民,不知道地址栏是什么。
amber0317
2023-11-06 22:29:04 +08:00
@huhexian 感谢,我也在想用户引导怎么做更好;目前输入 BV 号并不是主要入口,我更推荐直接把 B 站链接中的 www.bilibili.com 换成 bili.amono.me (主楼忘记讲了...),日常突发使用会方便些,在其他地方也是这样引导的
lessMonologue
2023-11-06 22:30:06 +08:00
支持一下。善于为用户着想的人,用户反馈不会差。
D2h0VL89HMAU417B
2023-11-06 22:46:15 +08:00
挺好看的
cnsouka
2023-11-06 23:14:08 +08:00
点开就下了一首鹿乃😂不过确实蛮好听的
lbb2445
2023-11-06 23:50:07 +08:00
感谢 lz,很符合我的需求.
个人提几个建议:
1.最好可以在页面显示输入框,我在下载多首的时候 切换的时候感觉有点操作不习惯
2.可以考虑支持正则
3.最好可以使用浏览器缓存稍微记一下我下载过的记录,因为使用 BV 我在下载以后 有时候分不清到底下载了哪一首
choah
2023-11-07 00:00:27 +08:00
遇到很多次 10%卡住然后下载失败的是什么原因呢
WanZi02
2023-11-07 01:07:01 +08:00
不错的楼主哥哥
mayne95
2023-11-07 08:32:54 +08:00
太酷了,完美解决需求。有时候听一些唱歌 up 直播切片的歌曲,每次下载都比较麻烦。蹲一个开源
mayne95
2023-11-07 08:40:06 +08:00
如果能做成 npm 包也不错。const file = await getBilibiliSong('BV1Ag4y1b7pa')。这样可以批量处理,下载收藏夹的全部歌曲什么的。
XIU2
2023-11-07 08:51:33 +08:00
你这个网站比较适合整个 JS 书签,需要的时候点一下就自动切换地址栏中的域名了。

你可以把这个书签内容放到网页中角落,引导使用者将其拖拽到书签栏,并告诉其在需要的时候点一下即可。

另外,对于多 P 是怎么处理的?是全部下载还在只下载第一个?
而且我试了下好像没有可以自行选择下载哪一 P 的选项。

另外,我记得 B 站是有单独的音频流的,而且好像还是 AAC ,你为啥选择转成 MP3 呢。
jiannei
2023-11-07 09:07:58 +08:00
地址栏即是输入框,很有启发
mayne95
2023-11-07 09:12:37 +08:00
再提供个思路,作为 PWA 安装,然后走 Web Share API https://developer.mozilla.org/en-US/docs/Web/Progressive_web_apps/How_to/Share_data_between_apps#handling_text_data

这样用户只需要在 b 站分享到你的 PWA App 就可以通过 url 拿到视频 id 了,整个流程更加自然。
amber0317
2023-11-07 09:18:59 +08:00
@lbb2445 @mayne95 收到,谢谢支持!批量下载确实是一个大需求,我目前有一个自用项目,可以实时监控某个 B 站收藏夹,并自动定期同步到本地;再完善下就开源出来哈
amber0317
2023-11-07 09:21:19 +08:00
@XIU2 拖拽到书签栏这个操作方式很帅,感谢建议!
多 P 目前是只下载第 1P ,这里暂时还没有做判断逻辑 = = 音频流这边可能还要容我找找 API ,我写这个项目的时候在响应里没拿到音频流链接,有的话确实方便很多
amber0317
2023-11-07 09:24:00 +08:00
@mayne95 👉https://github.com/AsterisMono/bili-music-sync/
不过这个目前没有做元数据嵌入
wanwaneryide
2023-11-07 09:53:20 +08:00
一键完成,确实好用
pumbf
2023-11-07 10:05:25 +08:00
这个能否支持会员的 hires 呢
tool2d
2023-11-07 10:11:36 +08:00
这项目有意思。

我是用 B 站音乐大量收藏后,批量下载到手机里,然后导出来用 FFMPEG 批量合并成 MP3 的。
LavaC
2023-11-07 10:18:13 +08:00
可以借 bilibilijj 和 github 调用在线编辑器的思路,前者就是注册一个和 bilibili 差不多的域名,用户在相应的视频页面的地址栏多输入几个字母就能跳转你的网站了,顺带有了视频信息;后者可以做一个简单的油猴脚本,一键摁就跳到你的网站,都挺方便的。

这是一个专为移动设备优化的页面(即为了让你能够在 Google 搜索结果里秒开这个页面),如果你希望参与 V2EX 社区的讨论,你可以继续到 V2EX 上打开本讨论主题的完整版本。

https://www.v2ex.com/t/989277

V2EX 是创意工作者们的社区,是一个分享自己正在做的有趣事物、交流想法,可以遇见新朋友甚至新机会的地方。

V2EX is a community of developers, designers and creative people.

© 2021 V2EX