添加教程
参考：
- https://hacpai.com/article/1583245365874/comment/1583467396134?r=cloudlang
- https://aplayer.js.org/#/zh-Hans/?id=%E5%8F%82%E6%95%B0
- https://github.com/metowolf/MetingJS
存在的问题
- Solo 3.9.0 ，如果把引入的 APlayer.js 文件放入 head 引入的话，会导致后台管理导航菜单无法正常刷新右侧页面，必须通过浏览器刷新，才能正常显示。
- 开启吸底模式 fixed =true，样式有些错乱，不完美
- 歌单不能实时更新。
解决办法
- 不要放入 HTML head，通过公告或者页脚引入都不会有问题。
- 关闭吸底模式 fixed =false，通过公告引入不会有样式问题。233333
- @233333 的作品样式没有问题，功能还在完善中，值得期待，链接：https://heycmm.cn/archives/1581935581
代码：
<!-- MetingJS音乐播放器 不能放到 head 导致系统功能加载异常-->
<link rel="stylesheet" href="//cdn.staticfile.org/aplayer/1.10.1/APlayer.min.css">
<script src="//cdn.staticfile.org/aplayer/1.10.1/APlayer.min.js"></script>
<script src="https://cdn.jsdelivr.net/npm/meting@2/dist/Meting.min.js"></script>
<meting-js server="netease" type="playlist" id="4902606135" autoplay="false" fixed ="true" </meting-js>
参数配置：
参考官方：https://aplayer.js.org/?utm_source=hacpai.com#/zh-Hans/?id=%E5%8F%82%E6%95%B0
| 名称 | 默认值 | 描述 |
|---|---|---|
| id | require | song id / playlist id / album id / search keyword |
| server | require | music platform:netease, tencent, kugou, xiami, baidu |
| type | require | song, playlist, album, search, artist |
| auto | options | music link, support:netease, tencent, xiami |
| container | document.querySelector('.aplayer') | 播放器容器元素 |
| fixed | false | 开启吸底模式，详情 |
| mini | false | 开启迷你模式，详情 |
| autoplay | false | 音频自动播放 |
| theme | '#b7daff' | 主题色 |
| loop | 'all' | 音频循环播放， 可选值： 'all', 'one', 'none' |
| order | 'list' | 音频循环顺序， 可选值： 'list', 'random' |
| preload | 'auto' | 预加载，可选值： 'none', 'metadata', 'auto' |
| volume | 0.7 | 默认音量，请注意播放器会记忆用户设置，用户手动设置音量后默认音量即失效 |
| audio | - | 音频信息， 应该是一个对象或对象数组 |
| audio.name | - | 音频名称 |
| audio.artist | - | 音频艺术家 |
| audio.url | - | 音频链接 |
| audio.cover | - | 音频封面 |
| audio.lrc | - | 详情 |
| audio.theme | - | 切换到此音频时的主题色，比上面的 theme 优先级高 |
| audio.type | 'auto' | 可选值： 'auto', 'hls', 'normal' 或其他自定义类型，详情 |
| customAudioType | - | 自定义类型，详情 |
| mutex | true | 互斥，阻止多个播放器同时播放，当前播放器播放时暂停其他播放器 |
| lrcType | 0 | 详情 |
| listFolded | false | 列表默认折叠 |
| listMaxHeight | - | 列表最大高度 |
| storageName | 'aplayer-setting' | 存储播放器设置的 localStorage key |
欢迎来到这里！
我们正在构建一个小众社区，大家在这里相互信任，以平等 • 自由 • 奔放的价值观进行分享交流。最终，希望大家能够找到与自己志同道合的伙伴，共同成长。
注册 关于