javascript - OpenFIGI API 和 CORS

Question

我正在尝试从浏览器应用程序连接 OpenFIGI API，我使用节点的 http-server 在本地托管该应用程序。我的 POST 请求看起来像这样

  var xhr = new XMLHttpRequest();
  var url = 'https://api.openfigi.com/v1/mapping';
  var params = [{"idType": "ID_WERTPAPIER", "idValue": "851399", "exchCode": "US"}];
  xhr.open('POST', url, true);
  xhr.setRequestHeader("Content-type", "text/json");
  xhr.onreadystatechange = function() {
    console.log(xhr.responseText);
  }
  xhr.send(params);

但我得到的只是错误

• Failed to load resource: the server responded with a status of 405 (Method Not Allowed)
• XMLHttpRequest cannot load https://api.openfigi.com/v1/mapping. Response to preflight request doesn't pass access control check: No 'Access-Control-Allow-Origin' header is present on the requested resource. Origin 'http://127.0.0.1:20000' is therefore not allowed access. The response had HTTP status code 405.

由于我一直在尝试不同的方式来处理请求和不同的设置，我想知道 - 这是否可能？我错过了什么w.r.t.要求？我查看了 OpenFIGI API 示例，但在那里找不到任何其他 (CORS) 设置。

Answer 1

OpenFIGI API 响应不包括使浏览器允许您的前端 JavaScript 代码访问响应所需的 Access-Control-* 响应 header 。因此，如果您想从前端代码发送请求，唯一的选择是使用代理。

要尝试通过公共(public) CORS 代理发出请求，请尝试将您的代码更改为:

var url = 'https://cors-anywhere.herokuapp.com/'
   + 'https://api.openfigi.com/v1/mapping';

通过 https://cors-anywhere.herokuapp.com 发送请求，它将请求转发到 https://api.openfigi.com/v1/mapping 然后接收响应。 https://cors-anywhere.herokuapp.com 后端然后将 Access-Control-Allow-Origin header 添加到响应中，最后将其传递回您的请求前端代码。

然后浏览器将允许您的前端代码访问响应，因为带有 Access-Control-Allow-Origin 响应 header 的响应是浏览器所看到的。

您还可以使用 https://github.com/Rob--W/cors-anywhere/ 轻松设置自己的 CORS 代理

有关当您使用 XHR 或 Fetch API 或来自 JavaScript 库的 AJAX 方法从前端 JavaScript 代码发送跨域请求时浏览器会做什么的详细信息，以及有关必须接收哪些响应 header 以使浏览器允许前端代码的详细信息访问响应——参见 https://developer.mozilla.org/en-US/docs/Web/HTTP/Access_control_CORS .