美文网首页
vue@3.0使用vue代理解决本地跨域问题

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

作者: 三亿 | 来源:发表于2020-01-10 11:03 被阅读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项目跨域成功。

    相关文章

      网友评论

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

          本文链接:https://www.haomeiwen.com/subject/yadpactx.html