封装统一API代理服务后Promise的reject无法被.catch捕获如何解决

问题原因 #

1. 核心语法错误
   你写的Promise构造函数语法不符合规范：

// 错误写法
return new Promise(resolve, reject) {

new Promise要求传入一个完整的执行函数作为参数，正确写法应该是：

return new Promise((resolve, reject) => {

这个语法错误会导致callApi方法执行时直接抛出同步异常，没有正常返回Promise实例，后续的.then/.catch链式调用自然不会生效。

2. 冗余Promise包装反模式
   本身this[module][request].call(...)已经返回Promise对象，额外套一层new Promise属于不必要的冗余写法，不仅增加代码复杂度，还可能引发异常传递层级问题。

修复方案 #

直接返回原生Promise的链式调用结果即可，无需额外嵌套：

// API Service 修正后代码
const ApiService = {
    callApi(module, request, ...args) {
        return this[module][request].call(null, ...args)
            .then(response => {
                // 原有正常返回处理逻辑保留
                return response;
            })
            .catch(err => {
                // 集中错误处理逻辑保留
                // 在这里做你需要的状态码判断、全局提示等逻辑
                return Promise.reject(err);
            });
    },

    moduleA: {
        requestA(argumentOne, argumentTwo) {
            return anAsyncApiCallHere(argumentOne, argumentTwo);
        }
    }
}

额外排查点 #

如果修复后还是触发不了外层catch，请检查以下两点：

• 你的自动生成API客户端代码中，遇到422等非2xx状态码时，是否没有正确抛出reject，而是当成正常返回执行了resolve？可以在callApi的then回调中打印返回值确认是否422响应走到了正常返回分支。
• 如果你用的是axios作为请求底层库，检查validateStatus配置是否被修改，允许了4xx状态码判定为请求成功。

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