vue-cli中使用proxyTable代理后，文件打包上线前是不是需要把接口都手动修改为线上接口？

Question

前端菜鸟一枚，最近自己在看vue-cli中的proxyTable代理接口，但是自己有个疑问，就是在开发环境中代理的接口和线上正式的接口地址不一样，是不是需要手动都手动修改为线上接口才可以打包编译上线呢？
但是这种太繁琐了，我觉得应该不是这样，哪位指点迷津一下^_^

Answer 1

答案肯定是不需要的，可以参考下vue-cli 搭建的项目处理不同环境下请求不同域名的问题，如果有帮助的话可以帮忙给个star

Answer 2

首先你的配置没有问题，可能你没理解其中的原理，且看我下面的分析：

举个例子：你生产环境要请求的地址为www.baidi.com:8080/aa/bb

你在开发时，proxyTable的配置应该为：
注意：下面的aa不是随便起的名字，必须为aa

'/aa': {
        target: 'www.baidi.com:8080/aa', 
        changeOrigin: true,
        pathRewrite: {
          '^/aa': ''
     }
    

项目中请求的地址应该为 axios.get('/aa/bb'),代理解析时会在aa前面加上"www.baidi.com:8080/aa"变成了"www.baidi.com:8080/aa/aa/bb",

但是由于配置中的pathRewrite把aa（第二个aa）改为空字符串，所以请求地址变为"www.baidi.com:8080/aa/bb"，

在项目打包上线时，代码里的请求地址不需要改动，下面我来说为什么，

线上代码运行时，碰到axios.get('/aa/bb')请求，因为在aa的前面有个"/",表示根目录的意思，

所以"/aa/bb"会被解析为hostname+port+"aa/bb",所以请求地址就为"www.baidi.com:8080/aa/bb"，

没有一点毛病，不知道你看明白了没

最近发现很多人最这一块不是很理解，我晚上会写一篇关于这方面的文章，明天给你贴地址

Answer 3

不需要的，proxyTable 只是在开发环境中起到代理的作用，解决开发环境的跨域问题；项目打包放到线上，需要后台的配置下Nginx解决跨域问题。