jQuery+JSON+jPlayer实现QQ空间音乐查询功能示例


Posted in Javascript onJune 17, 2013

jQuery+JSON+jPlayer实现QQ空间音乐查询功能示例
演示地址: http://bejson.com/demos/qqmusic/
代码下载:http://www.jqdemo.com/932.html
查询QQ音乐是很早前就出来的一个接口。
这里使用jQuery和jPlayer来实现QQ空间音乐的查询。
首先感谢bejson收集的各种有用的接口,当然也包含QQ空间音乐接口。
它的网址是:http://www.bejson.com/webInterface.php
我们要使用的接口位于bejson接口页面中的音乐接口栏里。
QQ音乐接口地址:
http://qzone-music.qq.com/fcg-bin/fcg_music_fav_getinfo.fcg?dirinfo=0&dirid=1&uin=QQ号&p=0.519638272547262&g_tk=1284234856
这里给出核心代码:
1.gtk参数的获取方式

function getGTK() { 
var str = "@HR3etVm80"; 
var hash = 5381; 
for (var i = 0, 
len = str.length; i < len; ++i) { 
hash += (hash << 5) + str.charAt(i).charCodeAt(); 
} 
var gtk = hash & 0x7fffffff; 
//document.getElementById("gtk").value = gtk; 
return gtk; 
}

2.请求QQ空间接口
function getMusicId() { 
var qqNo = document.getElementById("qqNo").value; 
var url = 'http://qzone-music.qq.com/fcg-bin/cgi_playlist_xml.fcg?uin=' + qqNo + '&json=1&g_tk=' + getGTK(); 
$.getScript(url); 
}

3.回调拼装JSON
根据返回的JSON接口
jQuery+JSON+jPlayer实现QQ空间音乐查询功能示例 
我们来解析音乐JSON
function jsonCallback(data) { 
if(data.code==1){ 
alert(data.msg); 
return; 
} 
var songs = data.qqmusic.playlist.song; 
var dataStr = "["; 
for (var i = 0; i < songs.length; i++) { 
dataStr += "{"; 
dataStr += "title:'" + songs[i].xsong_name + "',"; 
dataStr += "mp3:'" + songs[i].xsong_url + "'"; 
dataStr += "}"; 
if (i < songs.length) { 
dataStr += ','; 
} 
} 
dataStr += ']'; 
eval("ds=" + dataStr); 
newPlayer(ds); 
}

最后我们调用jPlay播放器:
var playList; 
function newPlayer(data) { 
playList = new jPlayerPlaylist({ 
jPlayer: "#jquery_jplayer_1", 
cssSelectorAncestor: "#jp_container_1" 
}, 
data, { 
swfPath: "js", 
supplied: "mp3", 
wmode: "window" 
}); 
}
Javascript 相关文章推荐
JavaScript中圆括号()和方括号[]的特殊用法疑问解答
Aug 06 Javascript
JavaScript立即执行函数的三种不同写法
Sep 05 Javascript
js实现获取当前时间是本月第几周的方法
Aug 11 Javascript
jQuery实现对无序列表的排序功能(附demo源码下载)
Jun 25 Javascript
ES6中class类用法实例浅析
Apr 06 Javascript
详解vue过滤器在v2.0版本用法
Jun 01 Javascript
初探JavaScript 面向对象(推荐)
Sep 03 Javascript
JavaScript函数式编程(Functional Programming)组合函数(Composition)用法分析
May 22 Javascript
vue实现二级导航栏效果
Oct 19 Javascript
VUEX 数据持久化,刷新后重新获取的例子
Nov 12 Javascript
js中关于Blob对象的介绍与使用
Nov 29 Javascript
解决vant的Toast组件时提示not defined的问题
Nov 11 Javascript
JS图片无缝滚动(简单利于使用)
Jun 17 #Javascript
js二级地域选择的实现方法
Jun 17 #Javascript
Jquery和JS用外部变量获取Ajax返回的参数值的方法实例(超简单)
Jun 17 #Javascript
JS控制文本框textarea输入字数限制的方法
Jun 17 #Javascript
一个简单的JS鼠标悬停特效具体方法
Jun 17 #Javascript
js特效,页面下雪的小例子
Jun 17 #Javascript
js弹出窗口之弹出层的小例子
Jun 17 #Javascript
You might like
WinXP + Apache +PHP5 + MySQL + phpMyAdmin安装全功略
2006/07/09 PHP
php上传excel表格并获取数据
2017/04/27 PHP
跨域请求之jQuery的ajax jsonp的使用解惑
2011/10/09 Javascript
Javascript 鼠标移动上去 滑块跟随效果代码分享
2013/11/23 Javascript
JavaScript淡入淡出渐变简单实例
2015/08/06 Javascript
jQuery实现可编辑的表格实例讲解(2)
2015/09/17 Javascript
AngularJS表单详解及示例代码
2016/08/17 Javascript
微信小程序表单验证功能完整实例
2017/12/01 Javascript
React Navigation 使用中遇到的问题小结
2018/05/08 Javascript
Vue实现6位数密码效果
2018/08/18 Javascript
jQuery实现input输入框获取焦点与失去焦点时提示的消失与显示功能示例
2019/05/27 jQuery
JavaScript生成一个不重复的ID的方法示例
2019/09/16 Javascript
详细分析vue表单数据的绑定
2020/07/20 Javascript
[03:18]DOTA2放量测试专访820:希望玩家加入国服大家庭
2013/08/25 DOTA
python让图片按照exif信息里的创建时间进行排序的方法
2015/03/16 Python
使用pandas将numpy中的数组数据保存到csv文件的方法
2018/06/14 Python
Python统计纯文本文件中英文单词出现个数的方法总结【测试可用】
2018/07/25 Python
简单的Python调度器Schedule详解
2019/08/30 Python
Python编写打字训练小程序
2019/09/26 Python
细数nn.BCELoss与nn.CrossEntropyLoss的区别
2020/02/29 Python
Python sqlalchemy时间戳及密码管理实现代码详解
2020/08/01 Python
Java Unsafe类实现原理及测试代码
2020/09/15 Python
Python headers请求头如何实现快速添加
2020/11/03 Python
web页面录屏实现
2019/02/12 HTML / CSS
移动端HTML5实现文件上传功能【附代码】
2016/03/25 HTML / CSS
您的健身减肥和健康饮食专家:vitafy
2017/06/06 全球购物
Otticanet美国:最顶尖的世界名牌眼镜, 能得到打折季的价格
2019/03/10 全球购物
硕士研究生自我鉴定
2013/11/08 职场文书
宿舍打麻将检讨书
2014/01/24 职场文书
2014年基层党建工作总结
2014/11/11 职场文书
工作失误检讨书
2015/01/26 职场文书
幼儿园中班教师个人工作总结
2015/02/06 职场文书
海上钢琴师观后感
2015/06/03 职场文书
公司职员入党自传书
2015/06/26 职场文书
2016年“11.11”光棍节活动总结
2016/04/05 职场文书
JavaScript设计模式之原型模式详情
2022/06/21 Javascript