由于内部应用程序错误导致的 CORS 错误

CORS errors because of internal app error

我正在使用 CakePHP 4 创建一个简单的 API,但我遇到了一些 CORS 请求的问题。

Access to XMLHttpRequest at 'http://localhost/myapp.api/elaborations/add.json' from origin 'http://localhost:3000' has been blocked by CORS policy: No 'Access-Control-Allow-Origin' header is present on the requested resource.

一切都适用于所有其他请求,经过一些挖掘我发现错误是我的控制器中的未定义索引。如果我解决了这个问题,CORS 错误就会消失。我只是没有在我的日志文件中看到它,这是我的错。

尽管由于编码错误,看到 CORS 错误有点令人困惑。我想问题可能出在我的 CORS 配置中,因此出现了这个问题。

经过一些网络搜索、试验和错误,这就是我的结论。我知道它很难看,但我找不到更好的实际效果。

如何避免因编码问题而出现 CORS 错误?我想某处有一些重定向操作,但我不知道如何避免它。

<?php
namespace App\Middleware;

use Psr\Http\Message\ResponseInterface;
use Psr\Http\Message\ServerRequestInterface;
use Psr\Http\Server\RequestHandlerInterface;
use Psr\Http\Server\MiddlewareInterface;

class CorsMiddleware implements MiddlewareInterface
{
    public function process(
        ServerRequestInterface $request,
        RequestHandlerInterface $handler
    ): ResponseInterface
    {
        // Calling $handler->handle() delegates control to the *next* middleware
        // In your application's queue.
        $response = $handler->handle($request);

        if ($request->getHeader('Origin')) {
            $allowedDomains = [
                'https://myapp.it',
                'https://www.myapp.it',
                'http://localhost:3000',
            ];
            $origin = $_SERVER['HTTP_ORIGIN'];

            if (in_array($origin, $allowedDomains)) {
                header('Access-Control-Allow-Origin: ' . $origin);
            }

            header('Access-Control-Allow-Methods: POST, GET, PUT, PATCH, DELETE, OPTIONS');
            header('Access-Control-Allow-Headers: *');

            if (strtoupper($request->getMethod()) === 'OPTIONS') {
                exit(0);
            }
        }

        return $response;
    }
}

首先,不要直接访问 CakePHP 中的超全局变量,始终使用抽象的 API!此外,您不应该手动回显数据,包括 headers,再次使用抽象的 API!使用 superglobals 和回显数据只会给你带来麻烦,它会扰乱测试环境,它会导致数据无法(正确)发送等。

也就是说,为了适当的 CORS 覆盖,您还需要修改错误处理,因为错误控制器将创建一个新的响应实例。您应该能够在 ExceptionRenderer::_getController() 的自定义异常渲染器中处理 request/response,如下所示:

// in src/Error/AppExceptionRenderer.php
namespace App\Error;

use App\Http\Middleware\CorsMiddleware;
use Cake\Controller\Controller;
use Cake\Error\ExceptionRenderer;

class AppExceptionRenderer extends ExceptionRenderer
{
    protected function _getController(): Controller
    {
        $controller = parent::_getController();

        $cors = new CorsMiddleware();
        $response = $cors->setHeaders(
            $controller->getRequest(),
            $controller->getResponse()
        );

        return $controller->setResponse($response);
    }
}
// in config/app.php
'Error' => [
    'exceptionRenderer' => \App\Error\AppExceptionRenderer::class,
    // ...
],

您的 CORS 中间件将相应地提供 setHeaders() 方法,如果需要,您可以在其中设置 CORS headers,根据您的示例,它可能如下所示:

public function process(
    ServerRequestInterface $request,
    RequestHandlerInterface $handler
): ResponseInterface
{
    $response = $handler->handle($request);
    $response = $this->setHeaders($request, $response);

    return $response;
}


public function setHeaders(
    ServerRequestInterface $request,
    ResponseInterface $response
): ResponseInterface
{
    if ($request->getHeader('Origin')) {
        $allowedDomains = [
            'https://myapp.it',
            'https://www.myapp.it',
            'http://localhost:3000',
        ];
        
        $origins = $request->getHeader('Origin');
        $lastOrigin = end($origins);
        if (in_array($lastOrigin, $allowedDomains, true)) {
            $response = $response
                ->withHeader('Access-Control-Allow-Origin', $lastOrigin);
        }

        if (strtoupper($request->getMethod()) === 'OPTIONS') {
            $response = $response
                ->withHeader(
                    'Access-Control-Allow-Methods',
                    'POST, GET, PUT, PATCH, DELETE, OPTIONS'
                )
                ->withHeader('Access-Control-Allow-Headers', '*');
        }
    }

    return $response;
}

另见