解决博客aplayer插件音乐失效问题

ISSUE

解决博客aplayer插件音乐失效问题

前言

前几天发现博客音乐失效了，找找原因，解决下失效问题。

如果你只想知道关于aplayer插件音乐失效问题的内容，请在目录中找到需要的内容。

Aplayer使用

音乐插件:hexo-tag-aplayer 官网：链接

安装执行以下命令：

npm install --save hexo-tag-aplayer

因为最新的aplayer版本已经支持MetingJS,往文章插入音乐使用起来更为方便，在aplayer启用MetingJS：

打开博客配置文件_config.yml，编辑以下内容：

aplayer:
  meting: true

文章插入音乐的方式：

{% meting "歌曲ID" "服务器" "类型" "theme:#555" "mutex:true" "listmaxheight:340px" "preload:auto" %}

在文章添加以上代码就可以在文章任何位置添加音乐了。

参数说明：

server指音乐平台，netease指网易云音乐，tencent指的是QQ音乐

一个完整的播放器至少指定音乐平台，类型和标识资源的ID

选项	默认	描述
id(编号)	必须	歌曲ID /播放列表ID /专辑ID /搜索关键字
server(平台)	必须	音乐平台：netease，tencent，kugou，xiami，baidu
type（类型）	必须	song，playlist，album，search，artist
auto（支持类种 类）	options	音乐链接，支持：netease，tencent，xiami
fixed（固定模式）	false	启用固定模式，默认false
mini（迷你模式）	false	启用迷你模式,默认false
autoplay（自动播放）	false	音频自动播放，默认false
theme(主题颜色)	#2980b9	默认#2980b9
loop（循环）	all	播放器循环播放，值：“all”，one”，“none”
order(顺序)	list	播放器播放顺序，值：“list”，“random”
preload(加载)	auto	值：“none”，“metadata”，“’auto”
volume（声量）	0.7	默认音量，请注意播放器会记住用户设置，用户自己设置音量后默认音量将不起作用
mutex（限制）	true	防止同时播放多个玩家，在该玩家开始播放时暂停其他玩家
lrc-type（歌词）	0	歌词显示
list-folded（列表折叠）	false	指示列表是否应该首先折叠
list-max-height（最大高度）	340px	列出最大高度
storage-name（储存名称）	metingjs	存储播放器设置的localStorage键

下面我以MetingJS在文章插入网易云音乐中的音乐来说明使用方法。

使用示例：网易云音乐

1.进入网易云音乐网页版

​ 网易云音乐网页版链接

2.找到资源的ID

如谭晶的《爱的神话》，在网易云音乐的链接是https://music.163.com/#/song?id=26217047

26217047就是标识这首歌资源的唯一ID，类型就是song

插入文章的代码的一个示例：

{% meting "26217047" "netease" "song" "theme:#555" "mutex:true" "listmaxheight:340px" "preload:auto" %}

如果是想引用歌单到文章中：

某个歌单的链接：https://music.163.com/#/playlist?id=2983726621

歌单ID就是2983726621，类型是playlist

插入文章的代码的一个示例：

{% meting "2983726621" "netease" "playlist" "theme:#555" "mutex:true" "listmaxheight:340px" "preload:auto" %}

音乐失效问题

原因和解决方法

Aplayer用来解析的API失效了，在博客目录下Blog\Hexo\node_modules\meting\dist下可以找到用来解析的API:

https://api.i-meto.com/meting/api

因此只要替换掉失效的API就可以了，从网络中找到的一个API:

https://api.injahow.cn/meting/

尝试在网页中调用API:

成功解析，但是这个api的链接有些奇怪了🤦‍♂️

替换Blog\Hexo\node_modules\meting\dist目录下的Meting.min.js文件内容：

https://api.i-meto.com/meting/api --> https://api.injahow.cn/meting/

最后刷新缓存，就可以看到文章中的音乐已经重新解析成功了。

结语

分享一首好听的歌

哔哩哔哩 UP主:早稻叽