vue2 脚手架配置代理

东泽o.0

于 2021-08-20 12:00:26 发布

阅读量319

点赞数

本文链接：https://blog.csdn.net/qwe19991123/article/details/119820329

版权

本文介绍了在Vue.js项目中设置代理的两种方法。方法一是在vue.config.js中添加简单配置，使得请求直接转发到指定服务器，适用于单一代理需求。方法二则是详细配置多个代理规则，提供更灵活的控制，但请求需要加特定前缀。这两种方法在前端开发中常用于解决跨域问题。

摘要由CSDN通过智能技术生成

方法一

在vue.config.js中添加如下配置

devServer:{
      proxy:"http"localhost:5000"
}

说明：
1.优点：配置简单，请求资源时直接发送给前端(8080)即可
2.缺点：不能配置多个代理，不能灵活的控制请求是否走代理
3.工作方式：若按照上述配置代理，当请求了前端不存在的资源时，那么请求会转发给服务器(优先匹配前端资源)

方法二

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

module.exports = {
     devServer:{
        proxy: {
           '/api':{
             target:"http:localhost:5000",
             changeOrigin:true,
             pathRewrite:{'^/api':''}
           },
            '/api':{
             target:"http:localhost:5000",
             changeOrigin:true,
             pathRewrite:{'^/api':''}
           }
        }
     }
}