vue跨域处理+多个环境下使用

实际开发中，我们会在后端电脑上，使用它的本地服务器来进行开发，准备部署上线时，也会在测试服务器上使用，我们使用接口的时候不可能会写死，

比如从后端本地服务器上请求数据'http:192.168.x.xx"，在测试服务器上又得跑什么'xx.xxx.xxxx'

所以就需要这样跨域处理，

1，在vue.config.js里面devServer对象下面加上proxy，本地开启一个代理服务器，

 

然后新建一个.env.development 文件，顾名思义这个是只有在开发环境下才会生效的文件，
里面写上VUE_APP_BASE_API = '/api'
再新建.env.production文件，里面写上VUE_APP_BASE_API = ' '

2，然后$axios.post(VUE_APP_BASE_API+'你的地址')就可以正常请求数据

这样的话当你在生产模式时，请求的地址变成了'api/你的地址',这个api的意思就是代理另一个服务器的地址。当部署到测试环境或者生产环境时，VUE_APP_BASE_API可以就为空，就ok了。

3，上面的方法每一次都得手写，麻烦死了，所以我们需要新建个request.js文件来封装我们的axios请求，这个baseURL就代表我们请求的根路径，

然后导出这个函数，

我们在开发中就可以正常去使用，强烈建议把我们用到的axios请求单独列到一个js文件里面，

这样我们开发时就很好用了，