一、jsonp跨域 npm install jsonp

然后创建一个jsonp.js 来使用jsonp import oringinJSONP from 'jsonp'

export default function jsonp(url, data, option) { url += (url.indexOf('?') < 0 ? '?' : '&') + param(data) //返回一个promise对象 return new Promise((resolve, reject) => { //resolve成功 reject失败 oringinJSONP( url, option, (err, data) => { if( !err ) { resolve(data); } else { reject(err) } }) }) }

function param( data ) { //拼接参数 let url = ''; for( var k in data) { let value = data[k] !== undefined ? data[k] : ''; url += &${k}=${encodeURIComponent(value)} } return url ? url.substring(1) : '' }

然后，创建一个方法使用上面的jsonp()

import jsonp from 'common/js/jsonp' import {commonParams, options} from './config' export function getRecommend() { //暴露一个方法 让人调用 const url = 'https://c.y.qq.com/musichall/fcgi-bin/fcg_yqqhomepagerecommend.fcg' //Object.assign()合并对象键和值 const data = Object.assign( {}, commonParams, { uin:0, platform:'h5', needNewCode:1 }) return jsonp(url, data, options) } 最后使用 import { getRecommend, songsList } from 'api/recommend'; getRecommend().then( (res) => { if(res.code === ERR_OK) { this.recommonds = res.data.slider; } });

二、使用axios进行跨域处理 在dev-server.js中， const app = express()

var axios = require('axios') //引入axios var apiRoutes = express.Router()

apiRoutes.get('/songsList', function( req, res ) { var url = "https://c.y.qq.com/musichall/fcgi-bin/fcg_yqqhomepagerecommend.fcg"; axios.get(url, { headers: { referer: 'https://m.y.qq.com/', host: 'c.y.qq.com' }, params: req.query }).then( (response) => { res.json(response.data) }).catch( (e) => { console.log(e); }) });

app.use('/api', apiRoutes);

然后在目标js中 function songsList() { const url = '/api/songsList' const data = Object.assign( {}, commonParams, { uin:0, platform:'h5', needNewCode:1, format: 'json' }) return axios.get(url, { params: data }).then((res) => { return Promise.resolve(res.data) }) } 然后执行songsList(),这种类似与欺诈的方法修改了请求头的host 和 referer，这样可以绕过同源策略的检测，进而达到跨域获取数据的效果。