Vue脚手架配置代理

方法一：

在vue.config.ja中添加配置：
devServer:{
    proxy:"http://localhost:1000"//服务器地址
}
说明：
1.优点：配置简单，请求资源时直接发给前端（8080）就可以。
2.缺点：不能配置多个代理服务器，不能灵活的控制请求是否走了代理。
3.工作方式：请求了前端不存在的资源时，那么该请求会转发给服务器（优选匹配前端资源，也就是前端有的资源）

方法二：

编写vue.config.ja配置具体代理规则：


module.exports = {
    devServer:{
       proxy:{
        '/api':{      //匹配所有以‘/api’开头的请求路径
            target:'http://localhost:1000',//代理目标的基础路径
            changeOrigin:true,
            pathRewrite:{'^api':''}
        },
        '/api2':{
            target:'http://localhost:2000',
            changeOrigin:true,
            pathRewrite:{'^api2':''}
        }
       }
    }
}
/*
 changeOrigin设置为true时，服务器收到的请求头中的host为1000
 changeOrigin设置为false时，服务器收到的请求头中的host为8080
 changeOrigin默认值是true
*/
说明：
1.优点：可以配置多个代理，且可以灵活控制请求是否走代理
2.缺点：配置略微繁琐，请求资源必须加前缀

最后

以上就是温柔小海豚为你收集整理的Vue脚手架配置代理的全部内容，希望文章能够帮你解决Vue脚手架配置代理所遇到的程序开发问题。

如果觉得靠谱客网站的内容还不错，欢迎将靠谱客网站推荐给程序员好友。