Codeigniter 4 中的 CORS 问题：对预检请求的响应未通过访问控制检查

Question

我正在使用 Codeigniter 4 为 React 应用程序制作一个 api。在邮递员中一切正常，但是当我使用 axios 发出请求时（也尝试过 fetch），它会出现 CORS 错误

从源“ http://localhost: 3000 ”访问位于“http://localhost:8080/testpost”的XMLHttpRequest已被 CORS 策略阻止：对预检请求的响应未通过访问控制检查：无“访问控制” -Allow-Origin'标头存在于请求的资源上。

我尝试向基本控制器添加标头：

header('Access-Control-Allow-Origin: *');
header("Access-Control-Allow-Methods: POST,GET, OPTIONS");
header("Access-Control-Allow-Headers: *");

现在，它可以很好地处理没有 JSON 正文的请求，但是当我发送 json 正文时，会发生相同的错误。

axios.post("http://localhost:8080/testpost", { data: "test" })
    .then((response) => {
        console.log(response);
    })
    .catch((err) => {
        console.log("error!!!");
    });

// Routes.php
$routes->post('/testpost', 'Home::testPost');

// Home Controller
public function testPost()
{
    return $this->response->setJSON('test response');
}

感谢您的帮助

Answer 1

请尝试设置 Apache 响应标头并将方法重定向到目录.htaccess的根www/public目录，如下所示：

#Redirect for CORS Preflight request
RewriteCond %{REQUEST_METHOD} OPTIONS
RewriteRule ^(.*)$ $1 [R=200,L]
#Set headers to access CORS Requests / allowing localhost only
Header always add Access-Control-Allow-Origin "*"
Header always add Access-Control-Allow-Headers "origin, x-requested-with, content-type"
Header always add Access-Control-Allow-Methods "PUT, GET, POST, DELETE, OPTIONS"

注意：添加Header always add Access-Control-Allow-Origin "*"到您的.htaccess,"*"为攻击者打开大门时要小心，替换*为您的域或 subdumain！