被CORS阻止：'Access-Control-Allow-Origin‘标头包含多个值'，'，Laravel8

被CORS阻止是指在进行跨域资源共享（Cross-Origin Resource Sharing，CORS）时，浏览器拒绝了对资源的访问请求。CORS是一种机制，用于在浏览器和服务器之间进行跨域通信，以确保安全性。

在这个问题中，错误信息显示'Access-Control-Allow-Origin'标头包含多个值'，'，这意味着在服务器的响应中，设置了多个允许访问的源。这是不被允许的，因为CORS规范要求'Access-Control-Allow-Origin'标头只能包含一个值。

解决这个问题的方法是在服务器端进行配置，确保只有一个允许访问的源被设置。对于使用Laravel 8框架的情况，可以通过中间件来处理CORS。

以下是一个示例中间件的代码，用于解决CORS问题：

<?php

namespace App\Http\Middleware;

use Closure;

class CorsMiddleware
{
    public function handle($request, Closure $next)
    {
        $response = $next($request);
        
        $response->header('Access-Control-Allow-Origin', '*');
        $response->header('Access-Control-Allow-Methods', 'GET, POST, PUT, DELETE');
        $response->header('Access-Control-Allow-Headers', 'Content-Type, Authorization');
        
        return $response;
    }
}

上述代码中，通过设置Access-Control-Allow-Origin标头为*，允许所有源进行访问。如果只想允许特定的源，可以将*替换为相应的源地址。

此外，Access-Control-Allow-Methods标头用于指定允许的HTTP方法，Access-Control-Allow-Headers标头用于指定允许的请求头。

在Laravel 8中，需要将该中间件添加到全局中间件或特定路由的中间件组中。可以在app/Http/Kernel.php文件中的$middleware或$middlewareGroups数组中添加以下代码：

protected $middleware = [
    // ...
    \App\Http\Middleware\CorsMiddleware::class,
];

// 或者

protected $middlewareGroups = [
    'web' => [
        // ...
        \App\Http\Middleware\CorsMiddleware::class,
    ],
    // ...
];

这样配置后，服务器的响应将包含正确的CORS标头，从而解决了被CORS阻止的问题。

腾讯云相关产品和产品介绍链接地址：