Laravel API开发中如何配置CORS解决跨域问题-Laravel-PHP中文网

Laravel API开发中如何配置CORS解决跨域问题

下次还敢

发布： 2025-11-24 17:17:02

原创

496人浏览过

答案是使用Laravel Sanctum、自定义中间件或fruitcake/laravel-cors解决CORS问题。推荐fruitcake/laravel-cors或Sanctum，配置允许的域名、方法和头，避免线上环境使用通配符，确保安全。

laravel api开发中如何配置cors解决跨域问题

在Laravel开发API时，前端请求经常会遇到跨域问题（CORS），这是因为浏览器的同源策略限制了不同源之间的资源访问。要让前端能正常调用Laravel后端接口，必须正确配置CORS。以下是几种常见且有效的解决方案。

使用 Laravel Sanctum 配置 CORS

Laravel Sanctum 是官方推荐用于SPA、移动端等场景的轻量级认证方案，它内置了对CORS的支持，尤其适合与Vue、React等前端框架配合使用。

安装Sanctum：

composer require laravel/sanctum

发布配置文件：

php artisan vendor:publish --provider="Laravel\Sanctum\SanctumServiceProvider"

在 config/cors.php 中配置允许的域名、方法和头信息：

'paths' => ['api/*', 'sanctum/csrf-cookie'],
'allowed_methods' => ['*'],
'allowed_origins' => ['http://localhost:3000'], // 允许的前端地址
'allowed_headers' => ['*'],

确保 App\Http\Middleware\HandleCors 已被启用，并在 app/Http/Kernel.php 的 $middleware 中注册。

手动配置中间件处理CORS

如果不想使用Sanctum，也可以自定义中间件来处理跨域请求。

生成中间件：

php artisan make:middleware Cors

编辑中间件文件 app/Http/Middleware/Cors.php：

小鸽子助手

一款集成于WPS/Word的智能写作插件

查看详情

public function handle($request, \Closure $next)
{
    return $next($request)
        ->header('Access-Control-Allow-Origin', 'http://localhost:3000')
        ->header('Access-Control-Allow-Methods', 'GET, POST, PUT, DELETE, OPTIONS')
        ->header('Access-Control-Allow-Headers', 'Content-Type, Authorization');
}

// 处理预检请求
if ($request->method() === 'OPTIONS') {
    return response('', 200)
        ->header('Access-Control-Allow-Origin', 'http://localhost:3000')
        ->header('Access-Control-Allow-Methods', 'GET, POST, PUT, DELETE, OPTIONS')
        ->header('Access-Control-Allow-Headers', 'Content-Type, Authorization');
}

将中间件注册到全局中间件或路由中间件中，在 app/Http/Kernel.php 添加：

'cors' => \App\Http\Middleware\Cors::class,