webstorm vue项目 axios 跨域代理

vue.config.js:(如果没有该文件就创建一个,或者是config/index.js)

module.exports = {
    devServer: {
        // 这个是前端项目启动的端口号,vue默认8080,如果与你后端端口不冲突,就不用修改
        port: 8888,
        // 配置不同的后台API地址
        proxy: {
            '/api': {//本地后端接口
                target: 'http://localhost:8080',
                ws: true,//websockets
                changeOrigin: true,//在本地会创建一个虚拟服务端,然后发送请求的数据,并同时接收请求的数据,这样服务端和服务端进行数据的交互就不会有跨域问题
                pathRewrite: {//路径重写
                    '^/api': ''//如果你不喜欢/api就把他改成你想要的,ps:'^/api': '/aaa'
                }
            }
        }
    }
};

axios请求:

axios.post(
          '/api//getAllUser',//ps:如果你重写了路径,此处为:'/aaa//getAllUser'
).then(function(resp) {
    console.log(resp.data);
});

最后一步:重新启动你的前端项目,一定要重启项目,不然代理是不会成功的

虽然,你查看network,会发现:


版权声明:本文为weixin_43853686原创文章,遵循CC 4.0 BY-SA版权协议,转载请附上原文出处链接和本声明。