如何从不同来源的 CORS 中获取数据？ [复制]答案

【问题标题】：How to fetch data from different origin CORS? [duplicate]如何从不同来源的 CORS 中获取数据？ [复制]
【发布时间】：2019-12-25 15:51:19
【问题描述】：

我正在尝试使用 Fetch API 将数据从不同的来源获取到另一台服务器，我准确地说是从 http 到 https

我可以从浏览器中读取数据，但我不知道如何获取它们。

我已经尝试将Access-Control-Allow-Origin 设置为*，但我仍然收到此消息：

我有点迷路了，谢谢你的支持。 ????

const myHeaders = new Headers({
  "Access-Control-Allow-Origin": "*",
  "Content-Type": "application/json"
});

const fetchConfig = {
  method: "GET",
  headers: myHeaders,
  mode: "cors",
  cache: "no-cache"
};

function fetchData(url) {

  fetch(url, fetchConfig)
    .then(response => {
      return response.json();
    })
    .then(data => {
      console.log(data);
    })
    .catch(error => console.error(error));

}

fetchData("https://api.example.com/");

【问题讨论】：

我不知道是不是我的浏览器的问题，但是我看不到您发布的错误图像。可以贴一下文字吗？
您在than 之后尝试过console.log(response)，得到的回应是什么？？
易于研究的主题。在询问之前始终尝试搜索。仅这个错误术语就会带来很多结果

标签： javascript cors http-headers fetch fetch-api

【解决方案1】：

Access-Control-Allow-Origin 标头需要由您从中检索数据的服务器设置，以响应您的请求。

【讨论】：

【解决方案2】：

CORS Anywhere 是一个 NodeJS 代理，它将 CORS 标头添加到代理请求。

代理的 URL 实际上是从路径中获取的，经过验证和代理。代理 URI 的协议部分是可选的，默认为“http”。如果指定端口 443，则协议默认为“https”。

这个包对 http 方法或标头没有任何限制，除了 cookie。不允许请求用户凭据。该应用程序可以配置为需要一个标头来代理请求，例如，避免来自浏览器的直接访问。

您只需在网址开头添加https://cors-anywhere.herokuapp.com/。喜欢这个https://cors-anywhere.herokuapp.com/http://example.com/api/...。

查看此链接了解更多详情：https://www.npmjs.com/package/cors-anywhere

【讨论】：