欢迎光临
我们一直在努力

一个HTML5播放器组件JS API,网页底部悬浮播放器,读取你的QQ音乐/网易云音乐歌单。

一个HTML5播放器组件JS API,网页底部悬浮播放器,读取你的QQ音乐/网易云音乐歌单。-同济互联

根据自己写的QQ音乐解析API和网易云音乐解析API开发出的这个HTML5播放器组件JS API,播放器框架和核心代码来自开源项目APlayer。

播放器界面简洁优雅,功能强大,直接调用QQ音乐/网易云音乐歌曲或歌单自动加载歌曲列表,支持单曲/歌单的形式,支持文章直接插入js代码,网页底部插入js代码即可,而且调用简单。

本播放器JS API采用jQuery异步加载的形式,一句js加载代码即可实现,网站所有内容加载完毕后才会加载播放器组件,后台异步加载,加快网站加载速度,站长的福音。

本JS API的优势:

  • 调用简单,一句js加载代码搞定
  • 功能强大,支持直接获取你的QQ音乐/网易云音乐的 单曲,歌单。
  • 支持音乐播放器的所有功能。
  • 支持网站底部悬浮
  • 支持自定义播放器参数

使用方法:

如果你网页头部中没加载jQuery.js(已加载jQuery请无视)请把以下代码复制到你的网页源码中head头部中:

<script type='text/javascript' src='https://mat1.gtimg.com/libs/jquery/1.9.1/jquery.min.js'></script>

首页底部播放器示例,添加以下JS代码到你的网页Body前:(代码可添加在任意位置)

<script type='text/javascript' src='https://api88.net/api/play/js/?后面所需参数请看下面参数列表'></script>

主要必须的参数:

参数名称说明使用方法
idQQ音乐&网易云音乐

歌单&歌曲

的ID

ID就是歌曲/歌单的唯一标识,用网页打开歌曲/歌单链接获取。获取方法:

根据音乐平台网站打开相应歌曲/歌单链接,在浏览器地址中复制红色字体的ID

网易单曲:https://music.163.com/#/song?id=1369798757

网易歌单:https://music.163.com/#/playlist?id=128509912

QQ单曲:https://y.qq.com/n/yqq/song/001HXIzh1hfxKw.html

QQ歌单:https://y.qq.com/n/yqq/playlist/3641614987.html

type播放器类型参数type=song:单曲播放器,type=songlist:歌单列表播放
music音乐平台参数music=qqmusic:QQ音乐,music=netease:网易云音乐

播放器扩展的强大参数自定义:

参数名称默认值使用方法/参数说明
fixedfalsefalse:关闭,true:开启吸底模式
minifalsefalse:关闭,true:开启迷你模式(注意:fixed吸底模式开启后不能开,会冲突)
autoplayfalse当参数值为 true 时音频自动播放
themeb7daff主题色,例如:青绿色 &theme=32CD32
loopall音频循环播放, all:无限循环, one:循环一次,none:不循环(注意:此功能只支持单曲模式,fixed吸底模式开启后不能开,会冲突)
orderlist列表音频循环顺序, list:列表循环,  random:随机播放列表歌曲(注意:此功能只支持列表模式)
listFoldedfalse列表默认展开,true:收起列表(注意:此功能只支持列表模式,fixed吸底模式开启后不能开,会冲突)
listMaxHeight数值列表最大高度,填写整数高度就行,例如600(注意:此功能只支持列表模式,fixed吸底模式开启后不能开,会冲突)

播放器调用示例(下划线字体标注了主要的参数)

迷你模式:

<script type='text/javascript' src='https://api88.net/api/play/js/?id=1369798757&type=song&music=netease&mini=true'></script>

单曲模式:

<script type='text/javascript' src='https://api88.net/api/play/js/?id=1369798757&type=song&music=netease'></script>

歌单模式:

<script type='text/javascript' src='https://api88.net/api/play/js/?id=128509912&type=songlist&music=netease'></script>

吸底模式(左下角悬浮):

<script type='text/javascript'src='https://api88.net/api/play/js/?id=128509912&type=songlist&music=netease&fixed=true&autoplay=true'></script>

版权声明

本接口数据均来自于音乐平台,本站不提供下载和存储任何数据。

  • 原创作者:小伟 QQ 523077333
  • 交流QQ群:34544417
  • 如需要技术支持,需要源代码的,请加好本站友链再联系本人,非诚勿扰谢谢!
赞(16) 打赏
未经允许不得转载:同济互联 » 一个HTML5播放器组件JS API,网页底部悬浮播放器,读取你的QQ音乐/网易云音乐歌单。
分享到: 更多 (0)

评论 4

  • 昵称 (必填)
  • 邮箱 (必填)
  • 网址
  1. #1

    这个有参数刷新缓存吗?我在同一个歌单里添加了几十首歌曲,但是不刷新列表

    哭的发甜6个月前 (03-17)回复
    • js的url后面加个&cache=0即可刷新缓存

      小伟6个月前 (03-17)回复
  2. #2

    找了一晚上终于找到了

    二三6个月前 (04-11)回复
  3. #3

    有右下角悬浮模式吗

    zj5个月前 (04-17)回复

同济互联 建站更专业 更方便

网站建设联系我们

觉得文章有用就打赏一下文章作者

支付宝扫一扫打赏

微信扫一扫打赏