Laravel 10 CORS 问题

Question

我在 Laravel 10 中遇到以下错误

访问 XMLHttpRequest 来自原点的“https://member.dev.mydomain.com/members/fernando/basic” “https://admin.dev.mydomain.com”已被 CORS 策略阻止： 对预检请求的响应未通过访问控制检查： “Access-Control-Allow-Origin”标头包含多个值 'https://admin.dev.mydomain.com、https://admin.dev.mydomain.work'，但是 只允许一个。

这是我的kernel.php

protected $middleware = [
        \App\Http\Middleware\TrustHosts::class,
        \App\Http\Middleware\TrustProxies::class,
        \App\Http\Middleware\PreventRequestsDuringMaintenance::class,
        \App\Http\Middleware\TrimStrings::class,
        // \Illuminate\Foundation\Http\Middleware\ValidatePostSize::class,
        // \Illuminate\Foundation\Http\Middleware\ConvertEmptyStringsToNull::class,
        // \Illuminate\Session\Middleware\StartSession::class,
        // \App\Http\Middleware\PreflightResponse::class,
        \Illuminate\Foundation\Http\Middleware\CheckForMaintenanceMode::class,
        \Illuminate\Http\Middleware\HandleCors::class,
        \App\Http\Middleware\PreventRequestsDuringMaintenance::class,
        //\App\Http\Middleware\EncryptCookies::class,
        //\Illuminate\Cookie\Middleware\AddQueuedCookiesToResponse::class,
        \Illuminate\Session\Middleware\StartSession::class,
        //\Illuminate\View\Middleware\ShareErrorsFromSession::class,
        // \Illuminate\Foundation\Http\Middleware\VerifyPostSize::class,
        \Illuminate\Foundation\Http\Middleware\ValidatePostSize::class,
    ];

这是我的config/cors.php

<?php

return [

    'paths' => ['*'],

    'allowed_methods' => ['*'],

    'allowed_origins' => ['*.dev.mydomain.com'],

    'allowed_origins_patterns' => [],

    'allowed_headers' => ['*'],

    'exposed_headers' => [],

    'max_age' => 0,

    'supports_credentials' => true,
];

有人可以帮我在 Laravel 10 中解决这个问题吗？

Answer 1

您确定您没有意外地将 AJAX 请求从 .com 发送到 .work 吗？您的配置不包含 .work 域，但错误消息表明它存在于响应的 HTTP 标头中。

如果您的请求都在 .com 域内，也许您缓存了配置文件并且更改没有反映出来？您可以执行

./artisan config:clear

来删除缓存的配置。

来自响应（服务器）的 CORS 标头告诉您的浏览器允许发送什么内容以及发送到何处。如果它们与您的浏览器的请求不匹配，您的浏览器将自动取消请求以避免滥用。
我知道 CORS 中的通配符可能很挑剔。当浏览器发送 OPTION 请求时，您可以在开发工具的网络选项卡中检查请求和响应标头，并查看响应标头中是否缺少值。如果您发现任何差异，您可能需要尝试将它们添加到您的配置文件中，而不是通配符。