JavaScript的fetch返回200状态码但没有数据

Question

我有一个需求，需要在下拉菜单中显示所有世界上的国家。所以我找到了这个API终点终点链接。当我将这个终点链接复制粘贴到我的Web浏览器中时，我得到了一个包含所有数据（国家）的响应。

但是，当我尝试嵌入它到项目中时，出现问题。

getCountries() {
      try {
       
        fetch(`https://restcountries.eu/rest/v1/all`).then(data =>
          console.log(data)
        );
        
      } catch (error) {
        console.log("HERE ERROR COMES", error);
      }
    }

它确实转到了fetch方法的then块，但是给我输出。这里没有所谓的数据。即使我得到了成功的响应，为什么会这样？这与cors错误有关吗？

- margherita pizza

---

body 里面有什么？ - Evan Knowles

你看过 response.body 吗？你试过 response.json() 吗？响应的数据类型是否正确？阅读 fetch API 的规范，找到适合 restcountries 服务器返回内容的响应方法。你所谓的 data 是一个 Response 对象。你必须根据你正在获取的内容处理该响应，并自己创建真正的数据对象。 - Shilly

此外，这个 try...catch 不会完成任务 ;) - Papi

我认为问题在于，与axios不同，您无法直接在fetch方法中访问响应数据。您必须将其转换为JSON，然后访问它。我标记了答案，它对我有用。=）谢谢大家。 - margherita pizza

Answer 1

您可以按照以下方式使用：

let url = 'https://restcountries.eu/rest/v1/all';

fetch(url)
.then(res => res.json())
.then((data) => {
  console.log(data);
})
.catch(err => { throw err });

- protoproto

---

需要在 catch 中抛出异常吗？它将被包装成 Promise.reject(err)。 - Dimitri Kopriwa

哦，我不知道这个。我的代码很基础，使用了... - protoproto

Answer 2

这对我有效

function getCountries(){
  fetch("https://api.printful.com/countries ")
  .then((resp) => resp.json()) // Transform the data into json
  .then(function(data) {
     let countries = data.result;
     return countries.map(function(country){
        console.log(country.name);
        //Create your list here
     });
    });
}

- Omolewa Stephen

Answer 3

responce.type 'cors' 可能意味着跨域请求 - 并且它正在阻止它 - 尝试找到另一个 API

- doublethug