CORS 随机阻塞请求

Posted 2023-03-04

【中文标题】CORS 随机阻塞请求

【英文标题】：CORS blocking requests randomly

【发布时间】：2020-12-14 03:50:28

【问题描述】：

我目前使用 api rest 来通过 URI 传递控制器参数、版本和操作。但是，当我使用超过 19 个字符的 URI 执行请求时，会出现以下 CORS 错误：

CORS 策略已阻止从源“http://localhost:3000”访问“http://my-api-host/toll/vehicle/v1/list”处的 XMLHttpRequest：对预检请求的响应没有“ t 通过访问控制检查：它没有 HTTP ok 状态。

在身份验证中，即使 URI 超过 19 个字符，请求也能正常工作。但是，具有超过 19 个字符的不同 URI 的任何其他请求都会产生相同的错误。我使用我的应用程序的 API 并且请求正常工作。

我在 Reactjs 中使用 axios。该 api 已经配置为接受我正在使用的内容类型（应用程序/json），并且也已经在接受来自不同来源的请求。

我的请求代码：

request(uri, params = )
        return new Promise((resolve, reject) => 
            axios
                .post('http://my-api-host' + uri, JSON.stringify(params), 
                    headers: 
                        'Content-Type': 'application/json'
                    
                )
                .then(response => 
                    if (response.data.success) 
                        resolve(response.data);
                     else 
                        reject(response.data);
                    
                );
        );
    ;

奇怪的是，如果我在我的 API 中打印一些数据，请求会返回 200，然后我会捕获我打印的数据。在我这样做之后，它可以处理之前给出此错误的所有请求，然后我在 api 中再次打印一些数据并且它再次工作。是不是很奇怪？

【问题讨论】：

询问谁负责您的 API 服务器……？ 我们不可能知道为什么在这种情况下它会以不成功的代码进行响应。

服务器正确响应请求。在我们使用另一个带有 html 和 jquery 的 web 项目之前，一切都很好。我们也通过移动应用程序使用它，我们没有问题。但是我在 web 项目中使用 reactjs 时遇到了这个问题。

那么去弄清楚您现在提出的请求与您之前提出的有效请求有何不同。要么就是这样，要么检查接收端。您将不得不以一种或另一种方式在这里进行一些实际的调试。

这就是我的兴趣所在。我已经使用与上一个项目中使用的相同结构（使用 fetch）发出请求。我还做了正确的 apache 配置（允许 cors、来自不同来源的请求和 json 内容）。我已经调试了来自我的 api 请求的入口点，一切正常。我尝试了其他配置但没有任何解决，我只能通过在执行验证（有效令牌、操作、工具和访问级别）之前在我的 api 入口点返回一些数据来执行请求，然后在从随机数据中删除此返回之后请求有效。

【参考方案1】：

已解决！

问题是我的 API 接受了请求，但没有正确处理 OPTIONS 请求并且没有响应代码 200。

解决方案：

除了接受响应代码 200 之外，我还应用了 REQUEST_METHOD 何时为 OPTIONS 的比较。