与 API 的连接总是导致 CORS 飞行前错误

Posted

技术标签:

【中文标题】与 API 的连接总是导致 CORS 飞行前错误【英文标题】:Connection With API always results in a CORS Pre-Flight Error 【发布时间】:2021-08-11 18:37:09 【问题描述】:

这是一个非常简单的尝试,我必须建立与某个 API 的连接才能最终请求某些数据。 API 要求使用 Authorization 标头传递令牌,因为我已经尝试用我对 javascript 的知识非常有限的知识来实现​​。但是,无论我似乎对此代码或我所做的研究进行了哪些更改,似乎没有什么可以规避我得到的一个非常特殊的错误,即完整的:“CORS 策略已阻止从源访问 XMLHttpRequest :对预检请求的响应未通过访问控制检查:它没有 HTTP ok 状态。”我在下面提供的代码本质上是我所拥有的代码的最简单版本,因为我为解决此问题而实施的几乎所有其他代码对我收到的错误几乎没有什么改变。

我已阅读here,如果此请求错误是由于 Authorization 标头导致的,那么直接服务器访问将无法完成,这让我有点担心。此外,如果有帮助,这是我正在使用的API 文档的链接。对于试图规避这个问题的一些帮助,我真的很感激。提前感谢任何提供帮助的人!

<SCRIPT language = "JavaScript">
       var token = "ngtNLSLUFJV3bHkMXasoSxJlWmP8QmWlbPI4O5ab"
       
       var request = new XMLHttpRequest()

        request.open("GET", "https://ballchasing.com/api/", true);
        request.setRequestHeader("Authorization", token);
        request.setRequestHeader("Access-Control-Allow-Origin", "*");
        request.send();

       
   </SCRIPT>

【问题讨论】:

您无法通过浏览器 JavaScript 规避问题。您需要在您控制的服务器上安装服务器端代理。 【参考方案1】:

Access-Control-Allow-Origin 是一个响应头,所以你不能在客户端分配它。

您可以更改服务器响应标头,或者仅在开发中使用代理

【讨论】:

以上是关于与 API 的连接总是导致 CORS 飞行前错误的主要内容,如果未能解决你的问题,请参考以下文章

AWS API Gateway CORS 飞行前检查失败

restify cors 飞行前未连接

多个 CORS 适用于 GET 但不适用于 PUT/POST 与飞行前请求 Web api 2

来自基于 OWIN 的 WebAPI 的飞行前选项 CORS 令牌请求出现 400 错误

我们应该在发送响应时关闭飞行前 Cors 请求的连接吗?

JHipster:CORS 在表单登录时失败(实际请求,不是飞行前)