Vue学习手记04-跨域问题
01-安装axios,指令(npm install --save axios)
02-解决跨域问题
在config=>中创建一个新的文件proxyConfig.js
module.exports = { proxy: { '/apis': { //将www.exaple.com印射为/apis target: 'http://baidu.com', // 修改为你的接口域名 changeOrigin: true, //是否跨域 pathRewrite: { '^/apis': '' //需要rewrite的, } } } }
在config=>index.js文件中
引入:var proxyConfig = require('./proxyConfig')
赋值: proxyTable: proxyConfig.proxy,
03 - 在main.js中引入和定义全局url
import Axios from "axios"
Vue.prototype.$axios = Axios;
Vue.prototype.HOST = "/apis"
04 - 重新启动 npm start
05 - 项目中使用:
mounted() { var url = this.HOST + "/v1/restserver/ting?method=baidu.ting.billboard.billList&type="+ this.type +"&size=6&offset=0"; console.log(url); this.$axios.get(url) .then(res=>{ console.log(res); }) .catch(error=>{ console.log(error); }) },