对 Laravel 做出反应——Cors 中间件不工作

Question

像其他解决方案一样尝试了很多东西

在 route.php 中

header('Access-Control-Allow-Origin: http://www.campaignpulse.com/');

或

header('Access-Control-Allow-Origin: www.campaignpulse.com/');

或

header('Access-Control-Allow-Origin:  *');
header('Access-Control-Allow-Methods:  POST, GET, OPTIONS, PUT, DELETE');
header('Access-Control-Allow-Headers:  Content-Type, X-Auth-Token, Origin, Authorization');

Route::post('cors', ['middleware' => 'cors',function () { return response()->json(['message' =>'cors'], 200); }  ]);

cors.php

public function handle($request, Closure $next)
    {
      return $next($request)
        ->header('Access-Control-Allow-Origin', 'http://www.campaignpulse.com/')
         or
        ->header('Access-Control-Allow-Origin', 'www.campaignpulse.com/')
         or
        ->header('Access-Control-Allow-Origin', '*')
        ->header('Access-Control-Allow-Methods', 'GET, POST, PUT, DELETE, OPTIONS')
        ->header('Access-Control-Allow-Headers:  Content-Type, X-Auth-Token, Origin, Authorization');
    }

kernal.php

  protected $middleware = [
            \App\Http\Middleware\CheckForMaintenanceMode::class,
            \Illuminate\Foundation\Http\Middleware\ValidatePostSize::class,
            \App\Http\Middleware\TrimStrings::class,
            \Illuminate\Foundation\Http\Middleware\ConvertEmptyStringsToNull::class,
            \App\Http\Middleware\TrustProxies::class,
            \App\Http\Middleware\Cors::class,
        ];


protected $routeMiddleware = [
        'auth' => \App\Http\Middleware\Authenticate::class,
        'auth.basic' => \Illuminate\Auth\Middleware\AuthenticateWithBasicAuth::class,
        'bindings' => \Illuminate\Routing\Middleware\SubstituteBindings::class,
        'cache.headers' => \Illuminate\Http\Middleware\SetCacheHeaders::class,
        'can' => \Illuminate\Auth\Middleware\Authorize::class,
        'guest' => \App\Http\Middleware\RedirectIfAuthenticated::class,
        'signed' => \Illuminate\Routing\Middleware\ValidateSignature::class,
        'throttle' => \Illuminate\Routing\Middleware\ThrottleRequests::class,
        'verified' => \Illuminate\Auth\Middleware\EnsureEmailIsVerified::class,
        'cors' => \App\Http\Middleware\Cors::class,
    ];

反应部分

      return fetch('http://www.campaignserver.com:81/cors', 
    {
        method: 'post',
        credentials: "same-origin",
        headers: {    
            'Accept': 'application/json',
            'Content-Type': 'application/json',
            'Access-Control-Allow-Origin': 'www.campaignpulse.com' },

    }
    ).then(response => response.json())
    .then(resData => {          

        console.log(resData)
    })

错误是

从源“http://www.campaignpulse.com”获取“http://www.campaignserver.com:81/cors”的访问权限已被 CORS 策略阻止：对预检请求的响应未通过访问控制检查：没有“Access-Control-Allow-Origin”标头出现在请求的资源上。如果不透明的响应满足您的需求，请将请求的模式设置为“no-cors”以获取禁用 CORS 的资源。

我还能尝试什么？请推荐

Answer 1

浏览器发出的跨源请求将向您的服务器发送飞行前 OPTIONS 请求，该请求必须至少返回 Access-Control-Allow-Origin 标头。 仅将其与对 POST 路由的响应一起返回是不够的。

我推荐使用像https://github.com/barryvdh/laravel-cors这样的包来提供CORS中间件和配置

还要注意来源是主机名或通配符。

ACAO 标头的有效值例如

• *
• https://www.example.org

没有 URI 部分

编辑

必须纠正自己，显然协议和端口是 ACAO 标头的有效部分，这是有道理的

https://developer.mozilla.org/en-US/docs/Web/HTTP/Headers/Access-Control-Allow-Origin https://developer.mozilla.org/en-US/docs/Web/HTTP/CORS

edit2

要调试它，请确保两者 OPTIONS http://www.campaignserver.com:81/cors 和 POST http://www.campaignserver.com:81/cors

返回一个标题 Access-Control-Allow-Origin: http://www.campaignserver.com:81 要么 Access-Control-Allow-Origin: *