Reactjs 如何从react应用程序从swapi获取？

我正在尝试使用以下代码从react应用程序调用：

export function getAsync(route: string, baseUrl: string) {
  // var url = baseUrl + "/" + route;
  let url = "http://swapi.dev/api/planets?page=1";
  let status: number;

  return fetch(url, {
    headers: {
      "content-type": "application/json",
    },
  })
    .then((response: any) => {
      status = response.status;
      console.log(response);
      return response.json();
    })
   //more stuff
}

但是我得到了这个错误：

Access to fetch at 'http://swapi.dev/api/planets?page=1' from origin 'http://localhost:3000' has been 
blocked by CORS policy: Response to preflight request doesn't pass access control check: Redirect is not 
allowed for a preflight request.

---

我需要做什么来修改我的提取请求？我注意到，连接到该API的示例使用了swapi.co，但后来改为swapi.dev.

查看文档后，url应该是这样的：

而不是：

当 请求本身满足一组特定的要求：

使用内容类型标题时，仅显示以下值 允许：应用程序/x-www-form-urlencoded、多部分/表单数据，或 文本/纯文本

所以我不能使用

“内容类型”：“application/json”

。实际上，我认为当您将数据从客户端发送到服务器时，应该使用内容类型。我们通常不会为一个简单的GET请求这样做

所以我应该写：

 return fetch(url, {
  })

---

也可能必须是https，即

https://swapi.dev/api/

。试试

https://swapi.dev/api/planets/?page=1

。