给你的网站或博客添加QQ音乐/网易云音乐歌单音乐播放器-命运与自由

文章简介：

给你的网站或博客添加QQ音乐/网易云音乐歌单音乐播放器

互联网多姿多彩，网页也少不了我们去探索，特别是我们自己的网站，博客等个人站，写文章的时候，写代码的时候，我们无聊可以听听哥放松放松无聊的心情。

給自己网站添加一个歌单播放器，让你的网站更加完美。

歌单需要API接口，我博客提供网易云音乐和QQ音乐歌单的API接口，可调用自己歌单的音乐。

歌单API接口文档

网易云音乐：http://www.mlwei.com/1446.html

QQ音乐：http://www.mlwei.com/1441.html

接口参数

参数名称	可否为空	使用方法/参数说明
key	必需	请用作者QQ：523077333 不懂直接联系，作者很热心的喔。
id	必需	歌曲/歌单的id，当type=so(搜索音乐)时，id的值为关键词，必须对中文进行URL编码
type	必需	解析类型：song 单曲，songlist 歌单，so 搜索，url 链接，pic 专辑图，lrc 歌词
cache	可空	默认=0不缓存，当cache=1时开启缓存，提高解析速度70%，数据不更新时，可把参数值改成cache=0访问一次即可清除缓存。
nu	可空	当type=so(搜索音乐)时有效，定义搜索结果数量，默认100

接口调用方法

接口地址：https://api.mlwei.com/music/api/wy/
请求方式：GET
返回格式：json

给自己网站添加一个歌单播放器：

首先在你网站要添加播放器的页面添加以下代码：

先确保你页面引入了jQuery.js，没有就在头部</head>之前添加：

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

在头部</head>之前引入播放器样式CSS：

<link rel="stylesheet" href="//cdn.staticfile.org/aplayer/1.10.1/APlayer.min.css">

在底部</body>前引入播放器JS文件：

<script src="//cdn.staticfile.org/aplayer/1.10.1/APlayer.min.js"></script>

然后在你要添加播放器的地方添加主要代码：

<div id="aplayer"></div>
<script language="JavaScript">
  var music = new Array();
  $.ajax({
    type: "GET",
    //歌单API接口
    //url: 'https://api.mlwei.com/music/api/?key=523077333&id=3641614987&type=songlist&cache=1&size=m4a',
    url: 'https://api.mlwei.com/music/api/wy/?key=523077333&cache=1&type=songlist&id=3014383109',
    dataType: 'json',
    success: function (result) {
      var ap = new APlayer({
        element: document.getElementById('aplayer'),
        lrcType: 3,//歌词类型
        volume: 1,//音量，100%
        mutex: true,//互斥打开，阻止多个播放器同时播放，当前播放器播放时暂停其他播放器
        fixed: true,//吸底模式，就是本站左下角播放器样式
        theme: '#45B6F7',//播放器主题色
        autoplay: true,//自动播放打开，关闭改成 false
        order: 'random',//顺序播放，随机播放改成random
        audio: result.Body
      });
    }
  });
</script>

然后刷新页面即可。

教程技术分享 Javascript

1582

上一篇

如何禁止网站内容复制？

下一篇

json数据的两种格式及两种json方法

mingyunyuziyou