qq音樂接口取到的vkey拼成的audio的src，剛開始可以正常播放，今天403了。請問如何才能正常？

跟著黃奕老師的VUE課程QQ音樂APP。做個音樂播放器，接口都是qq的。
現(xiàn)在歌單數(shù)據(jù)已經(jīng)有了，需要實現(xiàn)點擊歌曲就播放，打算使用audio標簽來實現(xiàn)。但是不知道如何生成audio標簽的src。課程中的src的方式已經(jīng)失效。去QQ看到他們的src是這樣的

http://dl.stream.qqmusic.qq.com/C400001uxKNp3a7Qkv.m4a?vkey=72E3CE808E6EB2FEBE2AA5A625DE5C12468604025CC9F05A0D0ADD898CB77FDF83888D29BEE6097761F53DE1C82B7DDB7A67AD38DD15517B&guid=504753841&uin=0&fromtag=66

點開幾首歌，對比分析了一下這個src，發(fā)現(xiàn)有這個src有下面這些參數(shù):
1.C400001uxKNp3a7Qkv
2.vkey=7F4E18EEF24DFC....
3.guid參數(shù)
4.uin參數(shù)
5.fromtag參數(shù)
但是變量只有1和2，guid,uin,fromtag都是&guid=504753841&uin=0&fromtag=66，似乎沒變化。
想生成1比較簡單，在得到的數(shù)據(jù)對象中的mid就是C400這個。

但是vkey比較麻煩，分析QQ的做法是通過每點擊一首歌就發(fā)送一個請求

請求參數(shù)：

請求url:

https://c.y.qq.com/base/fcgi-bin/fcg_music_express_mobile3.fcg

響應(yīng)得到的數(shù)據(jù)是這樣的

其中vkey就是這個請求的關(guān)鍵。

然后關(guān)鍵地方到了，我就模擬QQ來發(fā)送請求。用的是jsonp插件

上面這張圖的param()是用來將下面這張圖的data參數(shù)加入到url中，上圖的originJSONP()才是真正的jsonp插件的發(fā)送請求的函數(shù)。

如愿以償我得到了vkey.跟變量mid他們1,3,4,5一起拼接起來，放到vuex的state中，在src中直接使用state。
剛開始點擊歌曲是正常播放的。但是后來出現(xiàn)了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

現(xiàn)在問題是：
1.為什么不能穩(wěn)定播放？后來就403，是QQ采取了什么策略屏蔽了我的src嗎？(哎呀真是頭疼死了，剛才copy我的src的時候又好了)

回答

編輯回答

孤酒

2018年6月6日回答：
樓上的方法，給定固定的vkey,之前也使用過，后來發(fā)現(xiàn)有效期好像只有一天，所以就重新尋求新的解決方案。
受到這個回答的啟發(fā)：https://zhuanlan.zhihu.com/p/...
觀察網(wǎng)站上的請求，發(fā)現(xiàn)每首歌都有其自己的vkey,

所以思路就是在封裝歌曲信息的時候，就給每首歌封裝相應(yīng)的vkey即可
singer-detail.vue

_normalizeSongs (list) {
  let ret = []
  list.forEach((item) => {
    let {musicData} = item
    getSongVkey(musicData.songmid).then((res) => {
      // console.log('這首歌的vkey獲取到了')
      const vkey = res.data.items[0].vkey
      if (musicData.songid && musicData.albummid) {
        ret.push(createSong(musicData, vkey))
      }
    })
  })
  return ret
}

singer.js

export function getSongVkey (songmid) { // 獲取歌曲的vkey
  const url = 'https://c.y.qq.com/base/fcgi-bin/fcg_music_express_mobile3.fcg'
  const data = Object.assign({}, {
    callback: 'musicJsonCallback',
    loginUin: 3051522991,
    format: 'jsonp',
    platform: 'yqq',
    needNewCode: 0,
    cid: 205361747,
    uin: 3051522991,
    guid: 5931742855,
    songmid: songmid,
    filename: `C400${songmid}.m4a`
  })

  return jsonp(url, data)
}

song.js

export function createSong (musicData, vkey) { // 格式化歌曲信息
  return new Song({
    id: musicData.songid,
    mid: musicData.songmid,
    singer: filterSinger(musicData.singer),
    name: musicData.songname,
    album: musicData.albumname,
    duration: musicData.interval,
    image: `https://y.gtimg.cn/music/photo_new/T002R300x300M000${musicData.albummid}.jpg?max_age=2592000`,
    url: `http://dl.stream.qqmusic.qq.com/C400${musicData.songmid}.m4a?fromtag=38&guid=5931742855&vkey=${vkey}`
  })
}

這是昨天想出的方法，今天使用仍然可以，后續(xù)會不會因為guid再出現(xiàn)什么問題尚未可知。

2017年2月17日 13:56

編輯回答