javascript - 递归 XHR 承诺在没有调用堆栈的情况下抛出 404 错误

Question

我有一个函数可以进行服务器调用并返回一个承诺，如下所示：

function postToServer(url, body) {
  let xhr = new XMLHttpRequest();
  xhr.open(`POST`, url, true);
  xhr.setRequestHeader(`Content-type`, `application/json`);

  return new Promise((resolve, reject) => {
    xhr.onload = () => {
      if(xhr.readyState == XMLHttpRequest.DONE && xhr.status == 200) {
        resolve();
      } else {
        reject(xhr.status);
      }
    };

    xhr.send(body);
  });
}

这似乎对我的情况很好。但是，当我想在失败时重试该调用时，问题就来了。我有一个不同的功能来执行这个过程：

function postToServerAndRetryOnFail(url, body, failedAttempts = 0) {
  return new Promise((resolve, reject) => {
    postToServer(url, body).then(() => {
      resolve();
    }, statusCode => {
      failedAttempts++;

      if(failedAttempts <= maxAttempts) {
        wait(intervalBetweenAttempts).then(() => {
          postToServerAndRetryOnFail(url, body, failedAttempts);
        });
      } else {
        reject(statusCode);
      }

    });
  });
}

我希望在这里发生的是，当请求失败时，它会尝试直到达到最大尝试次数，此时它会返回拒绝。请注意，对于成功的请求，该函数的行为确实符合预期。

实际发生的是它失败，重试，失败，......（如预期）直到达到最大尝试次数。然后，我没有拒绝，而是uncaught exception: 404没有行号或堆栈跟踪。这里发生了什么？为什么不正常拒绝？

标签： javascriptrecursionpromisexmlhttprequestes6-promise