在JavaScript中获取fetch函数的结果

Question

我在使用JavaScript中的fetch方法时，无法获取到实际的结果数据。虽然可以使用XMLHttpRequest来完成，但我更愿意使用fetch方法。我一直在尝试从类似于以下的fetch请求中获取结果：fetch('https://api.website.net/?); 我知道需要分配一个then函数，但是我尝试过的所有方法都失败了，我只得到了更多的promise对象而没有结果。我模糊地理解需要为它分配一个.then函数以便在解析后使用，但我真的无法弄清楚如何做到这一点。（此处指浏览器JS，非Node.js）

- Benjamin Kantor

---

有成千上万（百万？）的承诺例子，一般和具体地说，没有更多信息很难确定你的具体问题是什么。如果你在非浏览器环境中，你需要使用polyfill来模拟fetch功能。 - jonrsharpe

哈哈，拜托了真的吗？你可以在 Promise 和 Fetch 上找到多个教程。在 JavaScript 中了解 Promise 要比只得到简单答案更好。 - Udendu Abasili

Answer 1

我认为你对Promise产生了困惑。fetch函数返回的是一个Promise，而不是数据。

我建议你阅读这份现代化的教程：https://javascript.info/fetch

以下是一个非常简单的函数，它获取URL并以JSON格式返回响应数据：

async function callApi(url) {
  const response = await fetch(url);
  const data = await response.json();

  return data;
}

let data = await callApi('https://api.website.net/?');
// do whatever you want with the data

处理primises时有两种语法，旧的.then()和新的async/await。一般来说，使用async/await更好，所以我建议使用async/await语法。使用.then()会像这样：

// Not recommended alternative

fetch('https://api.website.net/?')
  .then(response => response.json())
  .then(data => {
    // do whatever you want with the data
  });

- Maurici Abad

---

你帖子的第二部分有误导性。async/await只是对原始Promise的一种简化语法糖。.then是原始Promise语法中的一部分。 - Patryk Cieszkowski

Answer 2

试试这个：

fetch(....)
    .then(response => response.json())
    .then(data => /* use data */);

- Rinkal Rohara

---

你仍然需要等待承诺的完成。 - Patryk Cieszkowski