在 React App 中使用 axios 在 CakePHP API 中执行 PUT 方法时,预检选项中出现 404 Not Found 错误

404 Not Found error in preflight OPTIONS when executing a PUT method in CakePHP API with axios in React App

因此,我们有一个带有 CakePHP 3.7 的 API。我们正在使用 resources 生成 CRUD 方法。 API 托管在带有 apache2 的服务器中,并通过使用 React 的管理器应用程序访问(此应用程序是微服务)。管理器通过 axios 进行调用并正确管理 GET、POST 和 HEAD 请求(简单的 CORS 请求),但是当涉及到更复杂的请求(例如 PUT 或 DELETE)时,我们遇到了问题。

当执行 PUT 或 DELETE 请求时,它会发出预检 OPTIONS 请求,并且 returns 出现 404 Not Found 错误。控制台中与 CORS 相关的一些消息是:

我们已经尝试了几种修复方法,例如使用 CakePHP CORS plugin,在 AppController 的 beforeRender 和 beforeFilter 方法中的响应中添加 CORS Headers 以及在 apache 中添加 CORS headers , none 个接缝可以正常工作。

    private function setCorsHeaders() {
        $this->response->cors($this->request)
            ->allowOrigin(['*'])
            ->allowMethods(['*'])
            ->exposeHeaders(['X-Total-Pages'])
            ->maxAge(800)
            ->build();
    }

    public function beforeRender(Event $event)
    {
        $this->setCorsHeaders();
    }

    public function beforeFilter(Event $event)
    {
        if($this->request->is('options')) {
            $this->setCorsHeaders();
            return $this->response;
        }
    }
Header set Access-Control-Expose-Headers "X-Total-Pages"
Header set Access-Control-Allow-Origin "*"
Header set Access-Control-Allow-Methods "GET,HEAD,PUT,PATCH,POST,DELETE,OPTIONS"

预期的行为是正确执行 PUT 和 DELETE 方法(预检 OPTIONS 应该成功通过)。感谢任何帮助。

在 CakePHP >=3.4 中,Http\Response objects 是 treated as immutable by many methods. The method chain called on $this->request->cors() uses the CorsBuilder class 到 queue 所需的 headers 不可变响应在调用 build().

时被 returned

尝试将 CorsBuilder::build() 中的 return 与 queued headers 分配给 $this->response

    private function setCorsHeaders() {
        $this->response = $this->response->cors($this->request)
            ->allowOrigin(['*'])
            ->allowMethods(['*'])
            ->exposeHeaders(['X-Total-Pages'])
            ->maxAge(800)
            ->build();
    }