vue proxyTable 配置问题

以前解决跨域问题都是后台设置好了 Access-Control-Allow-Origin 之后,我就可以在直接调用所有接口都不跨域了

现在用了vue-cli些vue项目,也知道是在config的index.js文件里面更改,
但是为什么我这样写的

    dev: {
        env: require('./dev.env'),
        port: 8080,
        autoOpenBrowser: true,
        assetsSubDirectory: 'static',
        assetsPublicPath: '/',
        proxyTable: {
            '/index':{
                target:'http://线上接口',
                changeOrigin:true,
                pathRewrite:{
                    '^/index':''
                }
            },
            '/ms':{
                target: 'https://www.easy-mock.com/mock/592501a391470c0ac1fab128',
                changeOrigin: true
            }
        },
        // CSS Sourcemaps off by default because relative paths are "buggy"
        // with this option, according to the CSS-Loader README
        // (https://github.com/webpack/css-loader#sourcemaps)
        // In our experience, they generally work as expected,
        // just be aware of this issue when enabling this option.
        cssSourceMap: false
    }
this.$axios({
    method: 'post',
    url:'/index.php?mod=investment&code=check_invest_user',
    data:params
}).then((res)=>{
    console.log(res.data);
    if(res.data.errCode==0){

    }else if(res.data.errCode==1){
        this.$alert(res.data.retData.msg);
    }else if(res.data.errCode==2){
        this.$router.push('/login');
    }
});

调用接口的时候浏览器请求的就变成了本地的
http://localhost:8080/index.php?mod=investment&code=check_invest_user

图片描述

补充说明:
我重启下npm run dev 接口可以调成功了
但是返回的数据是空的
图片描述

之前后台有设置过Access-Control-Allow-Origin
如果我把线上接口直接写在 axios 里面url里 就不会有问题。。。数据都能拿到
图片描述

阅读 3.2k
2 个回答

你的配置的意思,你都没按配置写

/index/getUser -> http://线上接口/getUser

pathRewrite配置的问题。要么注释掉,要么如下面这样写

   proxyTable: {
        '/index':{
            target:'http://192.168.6.88',
            changeOrigin:true,
            pathRewrite:{
                '^/index':'index'
            }
        }
    },

重新run项目就好了

撰写回答
你尚未登录,登录后可以
  • 和开发者交流问题的细节
  • 关注并接收问题和回答的更新提醒
  • 参与内容的编辑和改进,让解决方法与时俱进