hexo添加音乐播放功能

使用APlayer插件

网易音乐外链地址：http://music.163.com/song/media/outer/url?id= .mp3

在网页版的网易音乐中找到想要的音乐获取ID，粘贴到上面url的id=处就可以获取音乐的外链

实现过程：

下载Aplayer文件解压，将里面的dist文件夹复制到themes\next\source文件夹下
在themes\next\source\dist\路径下，新建music.js文件，内容如下：

const ap = new APlayer({
container: document.getElementById('aplayer'),
fixed: true,
autoplay: false,
audio: [
{
name: "You are my sunshine",
artist: 'Elizabeth Mitchell',
url: 'https://s1.ax1x.com/2020/03/18/8dQvnI.th.jpg',
cover: 'https://imgchr.com/i/8dQvnI',
},
{
name: 'Shallow',
artist: 'Lady Gaga/Bradley Cooper',
url: 'http://music.163.com/song/media/outer/url?id=1313096578.mp3',
cover: 'https://s1.ax1x.com/2020/03/18/8d1EGD.th.jpg',
},
]
});

在themes\next\layout_layout.swig文件最后(body标签里面），添加：

<link rel="stylesheet" href="/dist/APlayer.min.css">
<div id="aplayer"></div>
<script type="text/javascript" src="/dist/APlayer.min.js"></script>
<script type="text/javascript" src="/dist/music.js"></script>

在hexo的左下面成功生成播放器
添加图片:把图片链接添加到第一次代码的对应歌曲处的图片链接里(我使用的是图床imgchr,帮助上说的是无线存储，免费)。建议添加图片时，选着链接为缩略图的链接。
刷新，成功显示播放器并且可以正常显示图片和播放音乐

歌词实现:

网易歌词获取
待更新

使用网易外链播放器(歌曲很容易收版权限制)

**直接在网页版网易音乐里找到单曲或歌单，直接生成外链播放器的HTML。把HTML放到想要展示的地方就可以了

网易很容易受版权限制，无法生成外链播放器

Aplayer的MeingJS

URL

使用html标签

写法如下：

<audio src="http://music.163.com/song/media/outer/url?id=1313096578.mp3" style="max-height :100%; max-width: 100%; display: block; margin-left: auto; margin-right: auto;" controls="controls" loop="loop" preload="meta">Your browser does not support the audio tag.</audio>

使用APlayer标签

1	{% aplayer title author url [picture_url, narrow, autoplay, width:xxx, lrc:xxx] %}

借鉴链接