网站插入 Aplayer/网易云音乐播放器

文章介绍了如何在网站中嵌入Aplayer和网易云音乐播放器的方法，包括使用MetingJS配置单曲、歌单播放器，并详细列出了相关配置选项。同时，提供了不直接使用Aplayer而使用网易云外链播放器的方法。

引入相关依赖

同样也是使用的Aplayer中的MetingJS
直接在界面中引入alplayer和meting需要的css文件和js文件

<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/aplayer/dist/APlayer.min.css">
<script src="https://cdn.jsdelivr.net/npm/aplayer/dist/APlayer.min.js"></script>
<!-- require MetingJS -->
<script src="https://cdn.jsdelivr.net/npm/meting@2/dist/Meting.min.js"></script>

配置使用

引入完Aplayer中和MetingJS后，就可以在界面中中使用 MetingJS 播放器了；
单曲：

<meting-js
	server="netease"
	type="song"
	id="1405349492">
</meting-js>

预览：

歌单：

<meting-js
	server="netease"
	type="playlist"
	id="5068325488">
</meting-js>

预览：

相关配置:

列1	列2	列3
选项	默认值	描述
id	必须值	歌曲 id / 播放列表 id / 相册 id / 搜索关键字
server	必须值	音乐平台: netease, tencent, kugou, xiami, baidu
type	必须值	song, playlist, album, search, artist
fixed	false	开启固定模式
mini	false	开启迷你模式
loop	all	列表循环模式：all, one,none
order	list	列表播放模式： list, random
volume	0.7	播放器音量
lrctype	0	歌词格式类型
listfolded	false	指定音乐播放列表是否折叠
storagename	metingjs	LocalStorage 中存储播放器设定的键名
autoplay	true	自动播放，移动端浏览器暂时不支持此功能
mutex	true	该选项开启时，如果同页面有其他 aplayer 播放，该播放器会暂停
listmaxheight	340px	播放列表的最大长度
preload	auto	音乐文件预载入模式，可选项： none, metadata, auto
theme	#ad7a86	播放器风格色彩设置

使用音乐平台提供插件

不使用Aplayer播放器；
以网易云为例，网页端点击生成外链播放器即可生成外链代码，如我的某个歌单生成外链。

可以在自己博客页面中嵌入插件:

<iframe 
 frameborder="no" border="0" 
 marginwidth="0" marginheight="0" 
 width=100% height=321 
 src="//music.163.com/outchain/player?type=0&id=5068325488&auto=0&height=430">
</iframe>

效果：