Promise.all实现其中有一个接口失败其他结果正常返回,如何实现?

好问题 👍

Promise.all 的特性是:只要有一个 Promise reject,整个 Promise.all 就会 reject,所以你看到的情况就是一个接口失败,整体就抛错了。

如果你的需求是:即使某个接口失败了,也希望其他成功的结果正常返回,有几种常见方案:


方案一:用 Promise.allSettled

ES2020 开始提供 Promise.allSettled,它会等待所有 Promise 都完成(无论成功还是失败),返回结果数组里包含每个 Promise 的状态和值:

javascript 复制代码
const reqs = [
  fetch("/api/1"),
  fetch("/api/2"),
  fetch("/api/3"),
];

Promise.allSettled(reqs).then(results => {
  results.forEach((res, i) => {
    if (res.status === "fulfilled") {
      console.log("接口", i, "成功", res.value);
    } else {
      console.log("接口", i, "失败", res.reason);
    }
  });
});

返回结果类似:

lua 复制代码
[
  { status: "fulfilled", value: ... },
  { status: "rejected", reason: ... },
  { status: "fulfilled", value: ... }
]

方案二:自己封装"永不 reject"的 Promise

如果你想继续用 Promise.all,可以把每个请求都 catch 一下,这样它们不会 reject:

less 复制代码
function wrap(promise) {
  return promise.then(
    res => ({ status: "fulfilled", value: res }),
    err => ({ status: "rejected", reason: err })
  );
}

Promise.all([
  wrap(fetch("/api/1")),
  wrap(fetch("/api/2")),
  wrap(fetch("/api/3")),
]).then(results => {
  console.log(results);
});

效果和 allSettled 一样。


方案三:只需要成功的结果

如果你完全不关心失败的接口,只要成功的值,可以这样:

javascript 复制代码
Promise.all([
  fetch("/api/1").catch(() => null),
  fetch("/api/2").catch(() => null),
  fetch("/api/3").catch(() => null),
]).then(results => {
  const validResults = results.filter(r => r !== null);
  console.log("成功的结果:", validResults);
});

✅ 推荐:如果浏览器或 Node 环境支持,直接用 Promise.allSettled,最直观清晰。

相关推荐
小光学长10 小时前
基于Vue的保护动物信息管理系统r7zl6b88 (程序+源码+数据库+调试部署+开发环境)带论文文档1万字以上,文末可获取,系统界面在最后面。
前端·数据库·vue.js
huangql52011 小时前
截图功能技术详解:从原理到实现的完整指南
前端·html5
长空任鸟飞_阿康11 小时前
Node.js 核心模块详解:fs 模块原理与应用
前端·人工智能·ai·node.js
这儿有一堆花11 小时前
网站链接重定向原理
前端
cecyci11 小时前
如何实现AI聊天机器人的打字机效果?
前端·javascript
IT_陈寒11 小时前
Vite 5个隐藏技巧让你的项目构建速度提升50%,第3个太香了!
前端·人工智能·后端
詩句☾⋆᭄南笙12 小时前
HTML的盒子模型
前端·html·盒子模型
落言12 小时前
AI 时代的工程师:懂,却非懂的时代
前端·程序员·架构
一枚攻城狮12 小时前
前端知识点大汇总
前端
Mike_jia13 小时前
DumbAssets:开源资产管理神器,家庭与企业的高效管家
前端