vue@3.0使用vue代理解决本地跨域问题

2020-01-10  本文已影响0人  三亿

在vue@cli 找到 vue.config.js

添加上配置代理接口的代码

proxyTable: {
      '/apis':{
        target: 'http://127.1.1.1:2000, //A服务器地址
        changeOrigin: true,    //改变源路劲
        pathRewrite: {
          '^/apis': '/'
        }
      },
      '/common':{
        target: 'http://127.1.1.1:1000', //B环境的数据
        changeOrigin: true,    //改变源路劲
        pathRewrite: {
          '^/common': '/'
        }
      }
    }, 

然后我们调接口的时候就可以这么写

this.$axios({
    url: '/apis/user/login',    //  '/common/user/login',
    method: 'get', 
    }).then(res => {
      console.log('success');
    }).catch({
      console.log('error');
    })
});

我们实际在Network面板上查看到的请求地址是:http://127.1.1.1:2000/user/login or http://127.1.1.1:1000/user/login
至此,本地vue项目跨域成功。

上一篇下一篇

猜你喜欢

热点阅读