vue中proxyTable反向代理进行跨域

一.分析

(一).jsonp的方式

(2).获取网上的数据

音乐盒

歌单的例子:

http://ustbhuangyi.com/music/api/getDiscList?g_tk=1928093487&inCharset=utf-8&outCharset=utf-8¬ice=0&format=json&platform=yqq&hostUin=0&sin=0&ein=29&sortId=5&needNewCode=0&categoryId=10000000&rnd=0.1335220255580194

1.config 下面的 prod.env.js

 proxyTable: { 
        '/apis/getDiscLists': {
            //target代表源地址
            target: 'http://ustbhuangyi.com/music/api/getDiscList',
            changeOrigin: true, //允许跨域
            pathRewrite: {
                '^/apis/getDiscLists': ''
            }
        }
    },

2.api/recommend.js

import axios from 'axios'
export const commonParams = {
	g_tk: 1928093487,
	inCharset: 'utf-8',
	outCharset: 'utf-8',
	notice: 0,
	format:'json'
};

export const options = {
	param: 'jsonpCallback'
};

export const ERR_OK = 0;
//获取全部歌单的数据
export function getDiscList() {
	const url = '/apis/getDiscLists'
	const data = Object.assign({}, commonParams, {
		platform: 'h5',
		uin: 0,//登录的qq号
		needNewCode: 0,
		platform:'yqq',
		hostUin:0,
		sin:0,
		ein:29,
		sortId:5,
		categoryId:10000000,
		rnd:0.1335220255580194

	})
	return axios.get(url,{
		params:data
	}).then((res)=>{
		return Promise.resolve(res.data)
	})
}

3.recommend.vue

vue中proxyTable反向代理进行跨域_第1张图片


你可能感兴趣的:(vue中proxyTable反向代理进行跨域)