vue-cli3 音樂播放器 接口說明(1)

輪播圖接口

推薦頁的歌單接口

params: {
        platform: 'yqq',
        hostUin: 0,
        sin: 0,
        ein: 29,
        sortId: 5,
        needNewCode: 0,
        categoryId: 10000000,
        rnd: Math.random(),
        format: 'json',
        // notice: 0,
        outCharset: "utf-8",
        inCharset: "utf-8"
            // g_tk: "1928093487"
    }
複製代碼

備註:這個接口不能夠直接請求,須要在項目中作後臺數據的反向代理:代碼以下:vue

//vue.config.js
 devServer: { //跨域配置
        before(app) {
            app.get('/api/getDiscList', (req, res) => {
                console.log(req.query)
                var url = 'https://c.y.qq.com/splcloud/fcgi-bin/fcg_get_diss_by_tag.fcg'
                axios.get(url, {
                    headers: {
                        referer: 'https://c.y.qq.com/',
                        host: 'c.y.qq.com'
                    },
                    params: req.query    //須要前臺返回數據,這裏向qq音樂在發出請求
                }).then((response) => {
                    res.json(response.data)   //數據返給前臺
                }).catch((e) => {
                    // console.log(e)
                })
            })

        }
複製代碼

歌手列表接口

data: {
        channel: 'singer',
        page: 'list',
        key: 'all_all_all',
        pagesize: 100,
        pagenum: 1,
        hostUin: 0,
        needNewCode: 0,
        platform: 'yqq',
        g_tk: 1928093487,
        notice: 0,
        format: "jsonp",
        inCharset:"utf-8",
        outCharset:"utf-8"
    }
複製代碼

歌手詳情頁接口

data: {
        inCharset: "utf-8",
        outCharset: "utf-8",
        notice: 0,
        pagesize: 100,
        pagenum: 1,
        hostUin: 0,
        needNewCode: 0,
        platform: 'yqq',
        g_tk: 1928093487,
        notice: 0,
        format: "jsonp",
        order: "listen",
        begin: 0,
        num: 80,
        songstatus: 1,
        singermid: "003Nz2So3XXYek"  //這個Id從歌手列表頁獲取
    }
複製代碼
//index.js 方法的封裝
import ajax from "./ajax";

export const getRecommendSwiper = () => ajax({
    url: "/api/musichall/fcgi-bin/fcg_yqqhomepagerecommend.fcg"
})

export const getDiscList = () => ajax({
    url: '/api/getDiscList',
    params: {
        platform: 'yqq',
        hostUin: 0,
        sin: 0,
        ein: 29,
        sortId: 5,
        needNewCode: 0,
        categoryId: 10000000,
        rnd: Math.random(),
        format: 'json',
        notice: 0,
        outCharset: "utf-8",
        inCharset: "utf-8",
        g_tk: "1928093487"
    }
})


export const getSinger = () => ajax({
    url: "/api/v8/fcg-bin/v8.fcg",
    params: {
        channel: 'singer',
        page: 'list',
        key: 'all_all_all',
        pagesize: 100,
        pagenum: 1,
        hostUin: 0,
        needNewCode: 0,
        platform: 'yqq',
        g_tk: 1928093487,
        notice: 0,
        format: "jsonp",
        inCharset: "utf-8",
        outCharset: "utf-8"
    }

})

export const getSingerDetail = () => ajax({
    url: "/api/v8/fcg-bin/fcg_v8_singer_track_cp.fcg",
    params: {
        inCharset: "utf-8",
        outCharset: "utf-8",
        notice: 0,
        pagesize: 100,
        pagenum: 1,
        hostUin: 0,
        needNewCode: 0,
        platform: 'yqq',
        g_tk: 1928093487,
        notice: 0,
        format: "jsonp",
        order: "listen",
        begin: 0,
        num: 80,
        songstatus: 1,
        singermid: "003Nz2So3XXYek"
    }
})
複製代碼
//vue.config.js 關於接口的配置
const path = require('path');
const axios = require("axios")

module.exports = {
    devServer: { //跨域配置
        proxy: {
            '/api': {
                target: "https://c.y.qq.com/",
                ws: true,
                changOrigin: true,
                pathRewrite: {
                    '^/api': ''
                }
            }

        },
        before(app) {
            app.get('/api/getDiscList', (req, res) => {
                var url = 'https://c.y.qq.com/splcloud/fcgi-bin/fcg_get_diss_by_tag.fcg'
                axios.get(url, {
                    headers: {
                        referer: 'https://c.y.qq.com/',
                        host: 'c.y.qq.com'
                    },
                    params: req.query
                }).then((response) => {
                    res.json(response.data)
                }).catch((e) => {
                    // console.log(e)
                })
            })

        }

    }
}
複製代碼
相關文章
相關標籤/搜索