JavaScript Async/Await轮询获取Celery任务状态未返回正确数据

你的问题出在递归调用getStatus时没有返回递归结果，导致最外层的getStatus调用无法拿到SUCCESS分支返回的数据。

修复步骤： #

1. 在getStatus的else分支中，添加return关键字，将递归调用的结果传递回上层函数
2. 在sendCancellationRequest中，拿到返回的status后可进行后续业务处理（比如更新组件状态）

修改后的完整代码： #

function cancelSimcard() {
  const cancellationLink = document.getElementById("cancellationLink");

  return {
    notificationOpen: false,
    message: "à remplacer",

    async sendCancellationRequest() {
      const data = await fetch(cancellationLink.dataset.url, {
        method: "POST",
      });
      const result = await data.json();
      // 接收SUCCESS状态的数据并处理
      const status = await getStatus(result.task_id);
      this.message = status.task_result; // 可根据实际接口返回字段调整
      this.notificationOpen = true;
    },
  };

  async function getStatus(task_id) {
    const statusData = await fetch(`/parc/task_status/${task_id}`, {
      method: "GET",
    });
    const statusResult = await statusData.json();

    if (statusResult.task_status === "SUCCESS") {
      console.log("DATA FROM SUCCESS BLOCK", statusResult);
      return statusResult;
    } else {
      await new Promise((resolve) => setTimeout(resolve, 1000));
      // 关键修改：返回递归调用结果，让数据逐层传递回最外层
      return await getStatus(statusResult.task_id);
    }
  }
}

原因说明： #

当任务状态未完成时，你递归调用了getStatus，但之前没有返回这个递归调用的结果。这意味着每一层递归的返回值都无法传递回上层，最终最外层的await getStatus(...)会得到undefined。添加return后，SUCCESS分支返回的statusResult会沿着递归链逐层传递，最终被sendCancellationRequest接收并使用。

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