跟着黄奕老师的VUE课程QQ音乐APP。做个音乐播放器,接口都是qq的。
现在歌单数据已经有了,需要实现点击歌曲就播放,打算使用audio标签来实现。但是不知道如何生成audio标签的src。课程中的src的方式已经失效。去QQ看到他们的src是这样的
http://dl.stream.qqmusic.qq.com/C400001uxKNp3a7Qkv.m4a?vkey=72E3CE808E6EB2FEBE2AA5A625DE5C12468604025CC9F05A0D0ADD898CB77FDF83888D29BEE6097761F53DE1C82B7DDB7A67AD38DD15517B&guid=504753841&uin=0&fromtag=66
点开几首歌,对比分析了一下这个src,发现有这个src有下面这些参数:
1.C400001uxKNp3a7Qkv
2.vkey=7F4E18EEF24DFC....
3.guid参数
4.uin参数
5.fromtag参数
但是变量只有1和2,guid,uin,fromtag都是&guid=504753841&uin=0&fromtag=66,似乎没变化。
想生成1比较简单,在得到的数据对象中的mid就是C400这个。
但是vkey比较麻烦,分析QQ的做法是通过每点击一首歌就发送一个请求
请求参数:
请求url:
https://c.y.qq.com/base/fcgi-bin/fcg_music_express_mobile3.fcg
响应得到的数据是这样的
其中vkey就是这个请求的关键。
然后关键地方到了,我就模拟QQ来发送请求。用的是jsonp插件
上面这张图的param()是用来将下面这张图的data参数加入到url中,上图的originJSONP()才是真正的jsonp插件的发送请求的函数。
如愿以偿我得到了vkey.跟变量mid他们1,3,4,5一起拼接起来,放到vuex的state中,在src中直接使用state。
刚开始点击歌曲是正常播放的。但是后来出现了403错误
比较同一首歌的两个src我的版本和QQ官方版本,其中除了vkey不一样,其他都是一样,vkey是随机生成,不一样也是正常的。
官方的src
http://dl.stream.qqmusic.qq.com/C400001uxKNp3a7Qkv.m4a?vkey=71FF9880454604D580A3B64BD664EEE92069E28F42780C2F2DCE3F6A26C6ECB30ED4E790833E580AA1D3943928049747691A9758158917A9&guid=504753841&uin=0&fromtag=66
我的src
http://dl.stream.qqmusic.qq.com/C400001uxKNp3a7Qkv.m4a?vkey=1373FD715FCE0AFB7580063C280CEE6945E3DC2E8D52CEE4567BD92E5EA78C1807D9730D34A8F592A7E096D2EF9FAB927921B4BD4FD357DA&guid=504753841&uin=0&fromtag=66
现在问题是:
1.为什么不能稳定播放?后来就403,是QQ采取了什么策略屏蔽了我的src吗?(哎呀真是头疼死了,刚才copy我的src的时候又好了)
昨天刚刚做好的,结果今天就换掉了,很气==
问题解决了
使用另一个接口,不用模拟请求这些麻烦的步骤,直接拿ID去GET
http://isure.stream.qqmusic.q...
中间的C100是自带的,后面补上你获取到的就好了,当然不保证一直有效。
有一些资源不清楚为什么还是403状态
希望能帮到你们,有用的话,给个赞赏也可以嘿嘿