异步/等待无法获取 JSON 数据 [重复]

Question

我在 Windows 上的 vagarnt 上运行 ubuntu 服务器。我在文件夹的文档根目录上有一个 JSON 文件。我想使用 async/await 来获取 JSON 数据。这是我在谷歌搜索和学习后得出的代码。

    async function getJSON() {
    try {
      var result = await makeRequest("GET", "./form-data/test-items/test.json");
      console.log(result);
    } catch(error) {
      console.log(error);
    }
  }

  function makeRequest(method, url) {
    return new Promise(function(resolve, reject) {
      let xhr = new XMLHttpRequest();
      xhr.overrideMimeType("application/json");
      xhr.addEventListener("readystatechange", function() {
        if (xhr.readyState === 4 && xhr.status === 200) {
          var respond = xhr.responseText;
          resolve(respond);
        } else {
          reject(xhr.statusText);
        }
      }, false);
      xhr.open(method, url, true);
      xhr.send();
    });
  }

  document.addEventListener("DOMContentLoaded", getJSON, false);

问题是只有异步函数中的catch块一直在运行。我确信我从 Ajax 请求中获得了响应文本，因为我已经在控制台上对其进行了测试。但我不知道 await 语句是如何失败的。

我该如何解决这个问题？我错过了哪一部分？

Answer 1

问题是一个简单的逻辑错误。这里：

if (xhr.readyState === 4 && xhr.status === 200) {
  var respond = xhr.responseText;
  resolve(respond);
} else {
  reject(xhr.statusText);
}

如果 readystate 不是 4 并且 status 不是 200，那么你拒绝了这个承诺。但这还为时过早。如果你检查：

https://developer.mozilla.org/en-US/docs/Web/API/XMLHttpRequest/readyState

您会注意到readyState 可以有 5 个不同的值。没有一个表示错误。

结论，试试这样的：

if (xhr.readyState === 4) {
  if (xhr.status === 200) {
    resolve(xhr.responseText);
  }
  else {
    reject(xhr.statusText);
  }
}