当前位置: 首页> 房产> 家装 > [Webpack]webpack-dev-server设置多个路径代理时,proxy顺序有要求

[Webpack]webpack-dev-server设置多个路径代理时,proxy顺序有要求

时间:2025/7/11 23:49:19来源:https://blog.csdn.net/qq_41790461/article/details/140962512 浏览次数:0次

问题背景

前端需要调用多个不同的后台时需要使用devServer.proxy做代理

问题现象

如下图设置ETL相关接口路径代理之后
在这里插入图片描述
调用ETL后台接口时产生404报错
在这里插入图片描述

问题原因

devServer.proxy在解析代理路径并替换的时候是按顺序解析的,我配置的三个代理中,/csm/etl/csm存在包含关系,所以在执行了第二个配置,把/csm替换为/之后,包含/csm/etl路径的接口全都被修改了;接下来再按第三个配置去匹配/csm/etl的路径就找不到了,所以接口会提示404报错

解决方法

修改配置的顺序,将复杂的路径匹配放到前面进行匹配,把被包含的元数据配置放到最后,如下图:
在这里插入图片描述
避免了代理干扰,代理成功,接口就掉通了

引申思考

如果多个配置之间互相存在多层的包含关系,则应该按照复杂程度大->小依次写入配置,如下图:
在这里插入图片描述

注意

修改webpack-dev-server配置后需要重启前端项目才能生效

关键字:[Webpack]webpack-dev-server设置多个路径代理时,proxy顺序有要求

版权声明:

本网仅为发布的内容提供存储空间,不对发表、转载的内容提供任何形式的保证。凡本网注明“来源:XXX网络”的作品,均转载自其它媒体,著作权归作者所有,商业转载请联系作者获得授权,非商业转载请注明出处。

我们尊重并感谢每一位作者,均已注明文章来源和作者。如因作品内容、版权或其它问题,请及时与我们联系,联系邮箱:809451989@qq.com,投稿邮箱:809451989@qq.com

责任编辑: