MirageJS开启passthrough时使用axios发起接口请求无响应如何解决？

MirageJS 是通过重写全局XMLHttpRequest、fetch API实现请求拦截的，该问题的核心是旧版本MirageJS的XHR拦截模块存在实现缺陷：当axios使用默认的XHR适配器发起请求，且该请求匹配到passthrough规则需要透传到真实服务端时，Mirage未正确触发XHR实例的load/error/abort等结束事件，导致axios的Promise一直处于pending状态，因此createAsyncThunk只会触发pending action，永远不会触发fulfilled或rejected action。

Mirage的fetch API拦截逻辑为独立实现，不存在该缺陷，因此替换为fetch请求可正常运行；关闭Mirage后XHR未被劫持，axios也可正常处理响应。

• 升级MirageJS到v1.0.0及以上稳定版本，该版本已修复XHR passthrough的事件触发缺陷，升级后无需修改业务代码即可正常运行。
• 替换axios的默认适配器为fetch适配器。安装@vespaiach/axios-fetch-adapter依赖后，在axios全局配置或单次请求配置中指定adapter: fetchAdapter，让axios基于fetch API发起请求，避开Mirage的XHR实现缺陷。
• 显式完善passthrough规则，声明请求方法和完整路径匹配规则，比如在Mirage初始化代码中写入this.passthrough('完整接口路径', ['POST'])，避免规则匹配异常导致的请求卡住。
• 直接使用fetch API发起需要透传的请求，该方案已验证可正常运行，适合临时快速修复问题。

内容的提问来源于stack exchange，提问作者foralobo