javascript - Axios api 调用 - 加载失败，预检响应无效(重定向)

Question

当我在 Nodejs 中使用 AdonisJs 框架在端口 3333 上运行下面的代码时，是否有任何原因可以正常工作。
但是如果我从我的 React 应用程序在 componentWillMount 的端口 3000 上运行它，我会收到错误

Failed to load https://jsonodds.com/api/odds/nfl: Response for preflight is invalid (redirect)


 componentWillMount(){
  axios.get("https://jsonodds.com/api/odds/nfl", {headers: {"X-Api-Key": "xxx"}})
        .then(function (response) {
        console.log(response)
        })
        .catch(function (error) {
          console.log(error);
        });

  }

Answer 1

预检请求是浏览器发送的请求for implementing CORS 。

NodeJS 只是不发出预检请求，因为它不需要实现 CORS。

预检请求是 OPTIONS 请求(因此不需要响应正文)，也不允许重定向。

要解决此问题，您需要正确配置 API 端，以便它不会返回 OPTIONS 请求的重定向。

[UPD] 如果您无法接触 API 服务器，您可以实现自己的后端代理，该代理将接受来自前端的请求并在内部询问 API 服务器。不会应用 CORS(及其预检限制)，您的 API key 也将被保密