ReactJS调用CodeIgniter REST API时出现CORS预检请求头缺失问题

这个CORS预检错误是因为你的CodeIgniter API没有正确配置跨域请求所需的响应头，尤其是针对预检OPTIONS请求的处理。结合你使用的chriskacerguis/codeigniter-restserver库，我给你几个针对性的解决方案：

1. 在API控制器构造函数中完善CORS头配置 #

你已经在构造函数里尝试添加header，但内容不够完整。可以扩展这段代码，覆盖所有CORS预检需要的响应头：

<?php defined('BASEPATH') OR exit('No direct script access allowed'); 
require APPPATH . '/libraries/REST_Controller.php'; 

class Api extends REST_Controller { 
    public function __construct($config = 'rest') { 
        parent::__construct($config); 
        $this->load->model('m_user'); 
        $this->load->model('m_cart'); 

        // 配置CORS响应头
        header("Access-Control-Allow-Origin: http://localhost:3000"); // 替换为你的React应用域名，开发环境可临时用*
        header("Access-Control-Allow-Methods: GET, POST, OPTIONS, PUT, DELETE");
        header("Access-Control-Allow-Headers: Content-Type, Authorization, X-Requested-With, access-control-allow-origin");
        
        // 直接处理OPTIONS预检请求，避免后续逻辑执行
        if ($_SERVER['REQUEST_METHOD'] === 'OPTIONS') {
            http_response_code(200);
            exit();
        }
    }
}

注意：生产环境不要用*作为允许的源，一定要指定具体的前端域名，避免跨域安全风险。

2. 利用REST库自带的CORS配置（更规范） #

这个REST服务器库本身提供了CORS配置选项，你可以直接修改application/config/rest.php文件：

$config['check_cors'] = TRUE;
$config['allowed_cors_headers'] = array('Content-Type', 'Authorization', 'X-Requested-With', 'access-control-allow-origin');
$config['allowed_cors_methods'] = array('GET', 'POST', 'OPTIONS', 'PUT', 'DELETE');
$config['allowed_cors_origins'] = array('http://localhost:3000'); // 支持多个域名，添加数组元素即可
$config['allow_any_cors_domain'] = FALSE; // 开发环境可临时设为TRUE，生产环境必须设为FALSE

配置完成后，库会自动帮你处理CORS响应头和OPTIONS预检请求，无需手动写header代码。

3. Apache服务器通过.htaccess全局配置CORS #

如果不想修改代码，也可以在项目根目录的.htaccess文件中添加全局CORS规则：

# 允许指定源跨域
Header set Access-Control-Allow-Origin "http://localhost:3000"
# 允许的HTTP方法
Header set Access-Control-Allow-Methods "GET, POST, OPTIONS, PUT, DELETE"
# 允许的请求头
Header set Access-Control-Allow-Headers "Content-Type, Authorization, X-Requested-With, access-control-allow-origin"

# 处理OPTIONS预检请求，直接返回200状态码
RewriteEngine On
RewriteCond %{REQUEST_METHOD} OPTIONS
RewriteRule ^(.*)$ $1 [R=200,L]

注意：需要确保Apache服务器启用了mod_headers和mod_rewrite模块。

额外注意事项 #

• 如果你前端请求中包含自定义头（比如Authorization），必须在Access-Control-Allow-Headers中明确列出，否则预检请求会失败。
• 检查服务器是否拦截了OPTIONS请求，部分安全配置可能会阻止这类请求，需要调整服务器规则。

内容的提问来源于stack exchange，提问作者S.M_Emamian