CORS 预检请求未通过访问控制检查：它没有 HTTP 正常状态

Question

我正在尝试使用授权标头向我的Wordpress REST API发出GET/POST请求，但作为响应，我得到了

预检请求未通过访问控制检查：它没有 HTTP 正常状态。

我正在使用 JWT 身份验证进行 WP-API 进行身份验证，并尝试了互联网上几乎所有可能的选项，但没有运气。

看看我当前的 .htaccess 配置

<IfModule mod_rewrite.c>
RewriteEngine On
RewriteBase /
RewriteRule ^index.php$ - [L]
RewriteCond %{REQUEST_FILENAME} !-f
RewriteCond %{REQUEST_FILENAME} !-d
RewriteRule . /index.php [L]
RewriteCond %{HTTP:Authorization} ^(.*)
RewriteRule ^(.*) - [E=HTTP_AUTHORIZATION:%1]
SetEnvIf Authorization "(.*)" HTTP_AUTHORIZATION=$1
RewriteCond %{REQUEST_METHOD} OPTIONS
RewriteRule ^(.*)$ $1 [R=200,L]
</IfModule>
<IfModule mod_headers.c>
Header always set X-Content-Type-Options "nosniff"
<IfModule mod_setenvif.c>
SetEnvIf Origin "^(http://localhost:3000)$" CORS=$0
</IfModule>
Header set Access-Control-Allow-Origin %{CORS}e env=CORS
Header set Access-Control-Allow-Credentials "true" env=CORS
Header set Access-Control-Allow-Methods "GET, POST, OPTIONS, HEAD" env=CORS
Header set Access-Control-Allow-Headers "*" env=CORS
Header set Access-Control-Expose-Headers "*" env=CORS
<FilesMatch ".(php|html)$">
</FilesMatch>
</IfModule>

当从 axios 发出请求时，我收到此错误

CORS 策略已阻止从源"http://localhost:3000"访问位于"HIDDEN_SERVER_ADDRESS"处的 XMLHttpRequest：对预检请求的响应未通过访问控制检查：它没有 HTTP 正常状态。

在PostMan中，呼叫工作正常并给出所需的结果。

Answer 1

在我的情况下，尝试 .htaccess 中所有可能的解决方案都没有帮助。因此，如果其他人在同一页面上，那么这是一个对我有用的解决方案。

将此代码放在 index.php 文件中，它将像一个魅力一样工作。

header('Access-Control-Allow-Origin: *');
header("Access-Control-Allow-Methods: HEAD, GET, POST, PUT, PATCH, DELETE, OPTIONS");
header("Access-Control-Allow-Headers: X-API-KEY, Origin, X-Requested-With, Content-Type, Accept, Access-Control-Request-Method,Access-Control-Request-Headers, Authorization");
header('Content-Type: application/json');
$method = $_SERVER['REQUEST_METHOD'];
if ($method == "OPTIONS") {
header('Access-Control-Allow-Origin: *');
header("Access-Control-Allow-Headers: X-API-KEY, Origin, X-Requested-With, Content-Type, Accept, Access-Control-Request-Method,Access-Control-Request-Headers, Authorization");
header("HTTP/1.1 200 OK");
die();
}

Answer 2

Azaz Khan提供的解决方案对我有用。我搜索了它为什么有效，我发现了这个关于使用 OPTIONS 方法的请求

使用跨源资源共享 (CORS( 时，将自动发送带有 OPTIONS 的预检请求，因此目标资源将使用可接受的参数进行响应。在正常的 Web 开发 scnario 中，不需要进行 OPTION 调用，因为它是由浏览器发出的。

所以我认为在身份验证请求之前，已经触发了带有 OPTIONS 方法的请求，但后端 API 没有返回 200 OK 响应。对我来说，后端发回了一个 PHP 错误，可能是 404 http 错误，我没有检查，但有了这段代码，我确信 API 会因为退出而返回 200 OK 响应：

<?php
header('Access-Control-Allow-Origin: *');
header('Content-Type: application/json; charset=UTF-8');
header('Access-Control-Allow-Methods: GET,POST,PUT,PATCH,DELETE');
header('Access-Control-Allow-Headers: Content-Type,Access-Control-Allow-Headers,Authorization,X-Requested-With');
if ($_SERVER['REQUEST_METHOD'] == 'OPTIONS') {
header('HTTP/1.1 200 OK');
exit();
}