laravel 10跨域配置推荐三方式:首选fruitcake/laravel-cors包统一管理,需安装、发布并配置cors.php;其次对单路由链式添加withheaders快速开放;最后可自定义cors中间件动态控制响应头。

Laravel 10 默认已集成 fruitcake/laravel-cors 的逻辑(通过自动服务发现),但需手动配置才能生效。核心是让服务器对跨域请求返回正确的响应头,尤其是处理浏览器发起的 OPTIONS 预检请求。下面分三类实用方式说明,按推荐顺序排列。
用 fruitcake/laravel-cors 包统一管理(最稳妥)
这是 Laravel 官方文档和社区一致推荐的方式,自动处理预检、动态匹配路径、支持凭证等细节。
- 安装包(如尚未安装):
composer require fruitcake/laravel-cors - 发布配置文件:
php artisan vendor:publish --tag="cors",生成config/cors.php - 编辑配置,关键项示例:
'*' 代替具体域名
-
paths:设为
['api/*', 'sanctum/csrf-cookie'](只对 API 路由启用) -
allowed_origins:开发写
['http://localhost:3000'];上线必须列全合法域名,如['https://app.example.com', 'https://admin.example.com'] -
supports_credentials:若前端带 Cookie(如 Sanctum 登录),此项设为
true,且allowed_origins不能是*
在 app/Http/Kernel.php 中,将中间件加入 $middlewareGroups['api'] 数组(不加到全局中间件,避免影响 Web 页面):
\Fruitcake\Cors\HandleCors::class
针对单个路由快速开放(适合调试或临时接口)
不改配置、不装包,直接在 routes/api.php 中链式添加响应头,精准控制,适合验证问题或灰度发布。
- 例如允许指定前端域名并支持凭据:
Route::get('/user', [UserController::class, 'show'])<br> ->withHeaders([<br> 'Access-Control-Allow-Origin' => 'https://myapp.com',<br> 'Access-Control-Allow-Credentials' => 'true',<br> 'Access-Control-Expose-Headers' => 'Authorization'<br> ]);
⚠️ 注意:若开启 Credentials,前端 fetch 或 axios 必须设置 credentials: 'include',否则仍被拦截。
自定义中间件(需要动态判断来源或深度集成)
当你要根据请求头、用户角色、子域名等条件动态决定是否放行,或与现有鉴权中间件耦合时适用。
- 执行:
php artisan make:middleware Cors - 在
handle()方法中处理预检和响应头:
先检查是否为 OPTIONS 请求,直接返回空响应(状态码 200);再对后续请求添加头信息:
$response = $next($request);<br>$origin = $request->header('Origin');<br>if (in_array($origin, ['https://app.example.com', 'http://localhost:3000'])) {<br> $response->headers->set('Access-Control-Allow-Origin', $origin);<br> $response->headers->set('Access-Control-Allow-Methods', 'GET, POST, PUT, DELETE, OPTIONS');<br> $response->headers->set('Access-Control-Allow-Headers', 'Content-Type, Authorization, X-Requested-With');<br> $response->headers->set('Access-Control-Allow-Credentials', 'true');<br>}<br>return $response;
最后在 Kernel.php 的 api 组中注册该中间件即可。











