使用Promise.all执行Axios批量GET请求异常排查

核心问题有三个： #

• async函数未返回Promise：map里的async回调没有return axios请求的Promise，导致promises数组全是undefined，Promise.all无法处理无效的Promise集合。
• 变量作用域错误：await Promise.all(promises)写在了map的回调内部，此时promises还未完成初始化，提前await未就绪的数组直接卡住代码执行。
• 语法结构不完整：原代码缺少闭合大括号，JS引擎无法正确解析完整逻辑。

修复后的代码： #

console.log("getting here")
// 先生成所有请求的Promise数组
const promises = Data?.stuff.map((id: any) => {
  return axios.get(`http://127.0.0.1:8080/api/v1/stuff/${id}`)
    .then(response => {
      console.log(response.data)
      return response.data;
    });
});

// 确保promises存在再执行await
if (promises) {
  const tempLesson: any = await Promise.all(promises);
  console.log("now getting here")
  console.log(tempLesson) // 所有请求返回的数据数组
}

额外优化建议： #

• 用模板字符串拼接URL更简洁：http://127.0.0.1:8080/api/v1/stuff/${id}
• 增加错误捕获，避免单个请求失败导致整体Promise.all报错：

const promises = Data?.stuff.map(async (id: any) => {
  try {
    const response = await axios.get(`http://127.0.0.1:8080/api/v1/stuff/${id}`);
    console.log(response.data);
    return response.data;
  } catch (err) {
    console.error(`请求id=${id}失败:`, err);
    return null; // 或自定义默认值
  }
});

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