已配置cors.php，Laravel Vapor仍出现CORS错误的解决咨询

问题背景 #

项目架构 #

• 后端：Laravel（部署于Vapor）
• 前端：Vue.js（部署于独立域名）

问题现象 #

前端向后端发起API请求时，触发CORS错误：

Access to fetch at 'backend_domain_url' from origin 'frontend_domain_url' has been blocked by CORS policy: Response to preflight request doesn't pass access control check: No 'Access-Control-Allow-Origin' header is present on the requested resource. If an opaque response serves your needs, set the request's mode to 'no-cors' to fetch the resource with CORS disabled.

当前CORS配置 #

后端config/cors.php配置如下：

'paths' => ['api/*'],
'allowed_methods' => ['*'],
'allowed_origins' => ['frontend_domain_url'],
'allowed_origins_patterns' => [],
'allowed_headers' => ['*'],
'exposed_headers' => [],
'max_age' => 0,
'supports_credentials' => false,

已尝试操作 #

• 确认前端域名已正确添加至allowed_origins
• 验证请求已携带正确的Origin请求头
• 调整CORS头配置参数，但问题未解决

问题原因分析 #

1. CloudFront缓存拦截预检请求：Vapor默认用CloudFront做CDN，OPTIONS预检请求可能被CloudFront直接拦截返回，未到达Laravel的CORS中间件，导致响应头缺失。
2. CORS中间件未正确注册：即便配置了cors.php，若app/Http/Kernel.php中未将HandleCors中间件加入全局或API路由组，配置不会生效。
3. 域名匹配不严格：allowed_origins中的域名格式错误（比如缺协议、末尾带斜杠），或前端实际请求的Origin与配置域名不一致。
4. 环境变量覆盖配置：Vapor环境中若设置了CORS_ALLOWED_ORIGINS等变量，会覆盖本地cors.php的配置。

解决方法 #

1. 确保CORS中间件正确注册 #

打开app/Http/Kernel.php，确认HandleCors中间件已加入全局中间件数组，或至少加入API路由组的中间件集合：

protected $middleware = [
    // ...其他中间件
    \Illuminate\Http\Middleware\HandleCors::class,
];

2. 配置CloudFront允许OPTIONS请求 #

在Vapor控制台进入对应环境的CloudFront配置，修改缓存行为：

• 将OPTIONS请求设为不缓存，确保请求能转发到Laravel应用
• 或在vapor.yml中添加自定义CloudFront规则：

environments:
    production:
        cloudfront:
            behaviors:
                - path: 'api/*'
                  allowed_methods: GET, HEAD, POST, PUT, PATCH, DELETE, OPTIONS
                  cached_methods: GET, HEAD

3. 修正域名匹配规则 #

确保allowed_origins中的域名与前端实际请求的Origin完全一致：

• 比如前端Origin是https://frontend.example.com，配置中不能写frontend.example.com（缺协议）或https://frontend.example.com/（末尾带斜杠）
• 多环境场景可使用正则匹配：

'allowed_origins_patterns' => [
    '/^https:\/\/.*\.example\.com$/',
],

4. 检查Vapor环境变量 #

登录Vapor控制台查看对应环境的变量，确认没有CORS_ALLOWED_ORIGINS等覆盖配置的变量，若有则调整为正确域名。

5. 手动添加CORS头（临时方案） #

若上述方法无效，可自定义中间件强制添加响应头：

<?php

namespace App\Http\Middleware;

use Closure;

class ForceCorsHeaders
{
    public function handle($request, Closure $next)
    {
        $response = $next($request);

        $response->header('Access-Control-Allow-Origin', env('FRONTEND_DOMAIN'));
        $response->header('Access-Control-Allow-Methods', 'GET, POST, PUT, DELETE, OPTIONS');
        $response->header('Access-Control-Allow-Headers', '*');

        return $response;
    }
}

将该中间件注册到全局或API路由组中。

Vapor环境对CORS的特殊影响 #

Vapor基于AWS Lambda和CloudFront，核心影响点在于：

• CloudFront的缓存策略可能拦截OPTIONS预检请求，导致Laravel的CORS中间件无法处理
• Lambda冷启动可能导致请求超时，但不会直接引发CORS头缺失
• Vapor的请求转发机制需要确保OPTIONS请求能正确到达Laravel应用

内容的提问来源于stack exchange，提问作者Dhaneshwari