Vue音樂項目筆記(四)(搜索頁面提取重寫)
阿新 • • 發佈:2018-08-17
isp catch gsl zone http open referer ace chcon
1.如何通過betterScroll組件實現上拉刷新 https://blog.csdn.net/weixin_40814356/article/details/80478440
2.搜索頁面跳轉單曲頁面 https://blog.csdn.net/weixin_40814356/article/details/80484183
3. 搜索頁面邊界情況的處理 https://blog.csdn.net/weixin_40814356/article/details/80490841
當沒有搜索結果的時候。添加一個圖片
每一次輸入和刪除字符,都會發一次請求,input的節流
滾動列表的時候,收起鍵盤
4.搜索歷史數據的處理 https://blog.csdn.net/weixin_40814356/article/details/80494165
5. 搜索列表的點擊刪除、刪除全部的交互事件 https://blog.csdn.net/weixin_40814356/article/details/80496097
6. 搜索信息頁面突然禁止訪問
修改如下:
在webpack.dev.conf.js文件中
1 app.get(‘/api/searchCon‘, function (req, res) { 2 var url = ‘https://c.y.qq.com/soso/fcgi-bin/search_for_qq_cp‘ 3 axios.get(url, { 4 headers: {View Code5 referer: ‘https://y.qq.com/m/index.html‘, //從音樂網站上得的 6 host: ‘c.y.qq.com‘ 7 }, 8 params: req.query 9 }).then((response) => { 10 res.json(response.data) 11 }).catch((e) => { 12 console.log(e) 13 })14 })
在api-search.js文件中:
1 export function search(query, page, zhida, perpage) { 2 const url = ‘/api/searchCon‘ 3 4 const data = Object.assign({}, commonParams, { 5 w: query, 6 p: page, 7 perpage, 8 n: perpage, 9 catZhida: 1, 10 zhidaqu: 1, 11 t: 0, 12 flag: 1, 13 ie: ‘utf-8‘, 14 sem: 1, 15 aggr: 0, 16 remoteplace: ‘txt.mqq.all‘, 17 uin: 0, 18 needNewCode: 1, 19 platform: ‘h5‘, 20 format: ‘json‘ 21 }) 22 23 return axios.get(url, { 24 params: data 25 }).then((res) => { 26 return Promise.resolve(res.data) 27 }) 28 }View Code
7. 歌單信息獲取也是禁止訪問狀態
修改同上 切記一定要把format 改為json
1 app.get(‘/api/getSongsList‘, function (req, res) { 2 var url = ‘https://c.y.qq.com/qzone/fcg-bin/fcg_ucc_getcdinfo_byids_cp.fcg‘ 3 axios.get(url, { 4 headers: { 5 referer: ‘https://y.qq.com/w/taoge.html‘, //從音樂網站上得的 6 host: ‘c.y.qq.com‘ 7 }, 8 params: req.query 9 }).then((response) => { 10 res.json(response.data) 11 }).catch((e) => { 12 console.log(e) 13 }) 14 })
Vue音樂項目筆記(四)(搜索頁面提取重寫)