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);
        })
   },

 




posted @ 2019-07-15 11:22  码锋窝  阅读(205)  评论(0编辑  收藏  举报