如何为 JQuery 和 Codeigniter 4 启用或允许 Access-Control-

Question

我正在构建一个 API 来激活和验证 PHP 脚本的活动安装，但我得到了“从源 'http://domain.te/requests/verify' 访问 XMLHttpRequest at 'http://api.domain.te/requests/verify'”。 te'已被 CORS 策略阻止：请求的资源上不存在“Access-Control-Allow-Origin”标头”控制台上出现错误。这是我的 jQuery 代码：function verify() {     $.post(url+"requests/verify", {        domain: domain    }, function(data) {        if (data.success === true) {            return true;        }    });    return false;}我已经阅读了类似的问题并尝试了所有建议，但似乎没有一个有效。在我的 PHP 代码中，我有：    public function verify()    {            $data['success'] = false;        $data['status']  = 'error';        $data['message'] = 'An error occurred';          if ($this->actives_m->check($this->request->getPost("domain")??""))        {             $data['success'] = true;            $data['status']  = 'success';            $data['message'] = 'Product is Active!';        }        else        {            $data['message'] = 'Product is Inactive!';        }        $this->response->setHeader('Access-Control-Allow-Origin', '*');        $this->response->setHeader('Access-Control-Allow-Methods', 'GET, POST');        return $this->response->setJSON($data);    }我也尝试在脚本的开头设置标题，<?php但仍然不起作用。我还尝试了内置的 PHPheader()函数，如下所示：header('Access-Control-Allow-Origin: *');header('Access-Control-Allow-Methods: GET, POST');我什至修改了我的 JS 看起来像：function verify() {     $.ajax({        url: url+"requests/verify",         type: "POST",        dataType: "JSON",        data: {domain: domain},         crossDomain: true,        success: function(data) {            if (data.success === true) {                return true;            }        }    });    return false;}到目前为止似乎没有任何效果，我应该从这里去哪里？更新： 我意识到如果我使用纯 Javascript，例如：    const xhr = new XMLHttpRequest();             xhr.open('GET', url+"requests/verify");    xhr.onreadystatechange = function(data) {        if (data.success === true) {            return true;        }    }    xhr.send();它按预期工作，但我必须使用 jQuery 来保持我的代码统一，并供将来参考。

Answer 1

每当出现跨域问题时，都会有两条路由受到影响。假设在您的示例中，您有对“http://api.domain.te/requests/verify”的 GET 请求，因此在使用 GET 请求访问服务器之前，它将使用 OPTIONS 请求访问相同的 url。这将验证您的服务器是否允许跨源请求的 API。

因此，在 CI4 路由中，您必须定义相同的 URL 或包含通配符才能启用跨源请求。

这里，以下示例是通配符请求。

$routes->options('(:any)', 'Controller/options');

在这里，该路由与具有 OPTIONS 方法的任何路由匹配，并且有一个名为 Options 的方法来处理它。

该选项方法可以定义如下：

public function options($any)

    {

        return $this->response->setHeader('Access-Control-Allow-Origin', '*') //for allow any domain, insecure

            ->setHeader('Access-Control-Allow-Headers', '*') //for allow any headers, insecure

            ->setHeader('Access-Control-Allow-Methods', 'GET, POST, OPTIONS, PUT, DELETE') //method allowed

            ->setStatusCode(200); //status code

    }

这个方法本质上是让浏览器知道请求是允许跨源的，状态方法有GET、POST、PUT和DELETE等。

浏览器点击此请求后，它将被定向到您的请求，该请求也应该启用跨源，如下所示：

$this->response->setContentType('application/json')->setJSON($response)->send()->setHeader('Access-Control-Allow-Origin', '*');

参考：https://carminemilieni.it/2019/09/19/resolve-cors-and-corb-in-codeigniter-4/

Answer 2

正如您已经所做的那样，必须从接收服务器端访问 CORS，因此我将.htaccess中的标头放入Apache 站点中（如果您使用不同的服务器，请检查如何执行此操作）：

Header set Access-Control-Allow-Origin "*" （在你的情况下，如果可以是多个未知域，它应该是 *）

Header set Access-Control-Allow-Headers "Origin, X-Requested-With, Content-Type, Accept"  （或者如果你也想要方法）

该标头的信息和选项： https://developer.mozilla.org/en-US/docs/Web/HTTP/Headers/Access-Control-Allow-Origin

您可以使用curl检查您发送的标头，它们是否出现？ curl -I http://api.domain.te/requests/verify