CodeIgniter 4 改进型自动路由与 AJAX 跨域请求的正确配置方法-php教程-PHP中文网

CodeIgniter 4 改进型自动路由与 AJAX 跨域请求的正确配置方法

本文详解 CodeIgniter 4 启用 autoRoutesImproved = true 后，AJAX POST 请求返回 404 的根本原因（预检 OPTIONS 请求未处理），并提供完整的跨域支持与路由适配方案。

本文详解 codeigniter 4 启用 `autoroutesimproved = true` 后，ajax post 请求返回 404 的根本原因（预检 options 请求未处理），并提供完整的跨域支持与路由适配方案。

在 CodeIgniter 4.2+ 中启用改进型自动路由（$autoRoutesImproved = true）后，控制器方法需严格遵循命名约定：postLogin() 会自动映射到 POST /authentication/login 路由。但实际开发中，前端发起 AJAX 请求时频繁遇到 404 错误，尤其针对 /authentication/login 这类路径——问题并非路由未注册，而是浏览器发起的 CORS 预检（Preflight）OPTIONS 请求被拒绝。

当 jQuery 或现代 Fetch API 发送带自定义头、JSON 内容类型或非简单方法（如 POST 表单外的请求）时，浏览器会先发送一个 OPTIONS 请求，询问服务器是否允许该跨域操作。而默认的 CI4 路由器不处理 OPTIONS 方法，导致该请求直接 404，后续 POST 请求甚至不会发出。

✅ 正确解决方案是：显式声明 OPTIONS 路由并返回标准 CORS 响应头，而非依赖自动路由处理。

步骤一：创建专用 Options 控制器

使用 Spark 命令快速生成：

php spark make:controller Options

编辑 app/Controllers/Options.php：

<?php namespace App\Controllers;

use CodeIgniter\Controller;

class Options extends Controller
{
    public function index()
    {
        return $this->optionsHandler();
    }

    public function optionsHandler()
    {
        // 允许所有来源（生产环境请替换为具体域名）
        header('Access-Control-Allow-Origin: *');
        // 允许的请求头（根据实际需求精简）
        header('Access-Control-Allow-Headers: Origin, X-API-KEY, X-Requested-With, Content-Type, Accept, Access-Control-Request-Method, Access-Control-Allow-Headers, Authorization, observe, enctype, Content-Length, X-Csrf-Token');
        // 允许的 HTTP 方法
        header('Access-Control-Allow-Methods: GET, PUT, POST, DELETE, PATCH, OPTIONS');
        // 支持 Cookie 和认证头
        header('Access-Control-Allow-Credentials: true');
        // 显式返回 200 OK 状态码
        header('HTTP/1.1 200 OK');
        exit(); // 阻止后续输出，确保响应纯净
    }
}

步骤二：在 `app/Config/Routes.php` 中注册通配 OPTIONS 路由

将以下行添加至路由配置末尾（确保在其他 $routes->post() 或自动路由之前）：

Skill Weave Chains — 技能链路由引擎

开箱即用的技能链路由引擎。13 条预定义链覆盖搜索、开发、审查、MLOps、法律、创意等场景，三层路由架构（触发词→SAD反馈→DAG编排），recall@10=96.97%。配置驱动（chains.yaml），零代码扩展。pip install skill-weave-chains 一键安装。

下载

// 处理所有预检 OPTIONS 请求
$routes->options('(:any)', 'Options::optionsHandler');

⚠️ 注意：此路由必须置于 $routes->setAutoRoute(true) 之后，且优先级高于其他动态路由，以确保任意路径的 OPTIONS 请求均被捕获。

步骤三：验证控制器方法命名与路由一致性

确认 Authentication 控制器中方法名符合规范：

class Authentication extends BaseController
{
    // ✅ 正确：public 方法名以 'post' 开头 → 自动映射为 POST /authentication/login
    public function postLogin(): ResponseInterface
    {
        $authModel = new AuthenticationModel();
        $response = $authModel->verifyLogin(
            $this->request->getPost('loginUsername'),
            $this->request->getPost('loginPassword')
        );

        return $this->response
            ->setJSON($response) // 推荐使用 setJSON() 替代 setBody()
            ->setStatusCode(200);
    }
}

? 提示：$_POST 在 CI4 中不推荐直接使用；应通过 $this->request->getPost() 安全获取数据，并启用 CSRF 保护（在 app/Config/Security.php 中设置 'csrfProtection' => 'session'）。

补充建议：生产环境安全加固

将 Access-Control-Allow-Origin: * 替换为白名单域名，例如：

$origin = $this->request->getHeaderLine('Origin');
if (in_array($origin, ['https://yourdomain.com', 'https://admin.yourdomain.com'])) {
    header("Access-Control-Allow-Origin: {$origin}");
}