React中fetch API的DELETE请求遭CORS拦截，Postman可正常执行

问题核心 #

浏览器发送DELETE请求前会自动发起OPTIONS预检请求，验证服务器是否允许跨域操作。你的错误提示明确指出：预检请求未返回HTTP OK状态，这是因为PHP API没有正确处理OPTIONS请求——Postman不会触发预检，所以测试正常，但浏览器会严格执行这个机制。

解决方案 #

1. 显式处理OPTIONS请求 #

在PHP接口的最顶部添加OPTIONS请求处理逻辑，直接返回200状态码，无需执行后续业务代码：

// 优先处理OPTIONS预检请求
if ($_SERVER['REQUEST_METHOD'] === 'OPTIONS') {
    http_response_code(200);
    exit;
}

// 原有的CORS头部配置
header("Access-Control-Allow-Origin: *");
header("Content-Type: application/json");
header("Access-Control-Allow-Headers: Content-Type, Access-Control-Allow-Headers, Authorization, X-Requested-With, Accept");
header("Access-Control-Allow-Methods: GET, POST, PUT, DELETE, OPTIONS");
header("Access-Control-Max-Age: 3600");

// 后续的路由、DELETE业务逻辑...

2. 排查输出干扰 #

确保在发送CORS头部之前，PHP代码没有输出任何内容（比如空格、echo语句、错误提示）——任何提前输出都会导致HTTP头部无法正确发送，进而引发预检失败。

3. 验证状态码一致性 #

DELETE接口返回204状态码是合理的，但OPTIONS请求必须返回200（或204）状态码，不能返回404、500等错误状态。

补充说明 #

DELETE属于非简单请求，浏览器必须先通过OPTIONS预检确认服务器允许跨域，才能发送实际的DELETE请求。你之前的CORS头部配置本身没问题，但缺失OPTIONS请求的处理逻辑，才导致了跨域错误。

内容的提问来源于stack exchange，提问作者Stavros Barousis