小编给大家分享一下vue2.x怎么通过后端接口代理获取qq音乐api的数据，相信大部分人都还不怎么了解，因此分享这篇文章给大家参考一下，希望大家阅读完这篇文章后大有收获，下面让我们一起去了解一下吧！
站在用户的角度思考问题，与客户深入沟通，找到和林格尔网站设计与和林格尔网站推广的解决方案，凭借多年的经验，让设计与互联网技术结合，创造个性化、用户体验好的作品，建站类型包括：成都做网站、成都网站建设、
成都外贸网站建设、企业官网、英文网站、手机端网站、网站推广、域名与空间、网页空间、企业邮箱。业务覆盖和林格尔地区。
前言: 部分qq音乐的api接口不能直接通过jsonp访问,需要通过官方的代理才能获取,如:歌词,推荐歌单等
1. webpack.dev.conf.js中创建接口:
// 开头调用:
var express = require('express')
var axios = require('axios')
var app = express()
var apiRoutes = express.Router()
app.use('/api', apiRoutes)
// devServer的最后添加:
before(app) {
app.get('/api/getDiscList', function (req, res) {
var url = 'https://c.y.qq.com/splcloud/fcgi-bin/fcg_get_diss_by_tag.fcg' // 原api
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)
})
})
}2. api的js文件中,将url换成步骤1中自定义的接口,通过axios获取返回数据
import jsonp from 'common/js/jsonp'
import {commonParams, options} from './config'
import axios from 'axios'
export function getDiscList() {
const url = '/api/getDiscList'
const data = Object.assign({}, commonParams, {
platform: 'yqq', // 加引号
hostUin: 0,
sin: 0,
ein: 29,
sortId: 5,
needNewCode: 0,
categoryId: 10000000,
rnd: Math.random(),
format: 'json'
})
return axios.get(url, {
params: data
}).then((res) => {
return Promise.resolve(res.data)
})
}3. 组件中通过api的js文件中的方法获取数据
import {getDiscList} from 'api/recommend'
_getDiscList() {
getDiscList().then((res) => {
if (res.code === ERR_OK) {
console.log('推荐:', res)
this.discList = res.data.list
} else {
console.log('没,没有推荐')
}
})
}以上是“vue2.x怎么通过后端接口代理获取qq音乐api的数据”这篇文章的所有内容，感谢各位的阅读！相信大家都有了一定的了解，希望分享的内容对大家有所帮助，如果还想学习更多知识，欢迎关注创新互联行业资讯频道！
网站标题：vue2.x怎么通过后端接口代理获取qq音乐api的数据-创新互联
文章链接：
http://cdkjz.cn/article/dpphpd.html
