vuecli3配置代理,vue配置代理只在开发环境使用

　　本文主要介绍了配置代理在vue3不同环境下的实现，具有很好的参考价值。希望对大家有帮助。如有错误或不足之处，请不吝赐教。

不同环境下如何配置代理

　　在实际开发中，我们经常会遇到并行开发的要求。第一个需求接口转发是地址，下一个需求接口转发是地址。如何解决这个问题？

　　前端也不申请多套环境。

　　在本地开发的时候，添加一个额外的代理，比如api2，然后在当前需要的接口前面使用这个。

　　但是，会有一个问题。前端页面加载后，只连接当前需求涉及的模块的接口，其他模块的接口报错(不是说其他模块有问题，其他模块已经测试过了)，因为你本地启动后，前端只有一套环境，后端却有两套环境，相互不一致。如果当前需求的模块数据依赖于前一个模块，测试过程将不会继续。

　　前端也申请俩套环境，配置相应的nginx。一般都是由运维配置，这样前端按照之前开发模式来就可以了，无需多加代理，nginx会把当前需求转发到后端对应的当前接口环境上，其他模块也不影响。

　　其实在打包的时候，后端代码是和前面的需求代码合并在一起的，这样一致性就不会影响了。

　　还有一个问题。在这种情况下，前端启动命令完全相同。如果要区分不同的环境，执行不同的命令来区分，怎么做呢？

　　在vue.config中添加读取的代码

　　包裹。杰森这么说的。

　　在本地开发时，浏览器中访问项目的地址是localhost，但是当我们需要验证第三方再返回本地项目时，会因为第三方的反弹地址是官方域名而不成功。

　　这时候你需要把域名映射到本地项目的地址，可以通过修改宿主文件来实现。

　　w2开始

　　启动后，添加规则：

　　/(?https http):\/\/griddev . jiuqi . com . cn/(。*)/http://127.0.0.1:9898/$1

　　搜索代理开关mega add

　　配置：

　　代理端口是8899，第一步中Whistle的默认端口号。如果Whistle的默认端口号被修改，则填写修改后的端口号。

　　关键信息

　　选择proxy，但是只有您在规则的第一步中匹配的域名可以在选择后被访问，并且它被传输到您配置的本地地址。所以跳转到第三方网站会不成功，像这样：

　　以上个人经历，希望能给大家一个参考，也希望大家多多支持我们。

郑重声明：本文由网友发布，不代表盛行IT的观点，版权归原作者所有，仅为传播更多信息之目的，如有侵权请联系，我们将第一时间修改或删除，多谢。