Laravel API核心-在飞行前响应中，Access-Control-Allow-Headers不允许请求标头字段授权

Question

我的Laravel API和Angular客户端应用程序之间出现CORS问题。

这是我的cors中间件

public function handle($request, Closure $next)
    {
        return $next($request)
            ->header('Access-Control-Allow-Origin', 'http://localhost:4200')
            ->header('Access-Control-Allow-Credentials', 'true')
            ->header('Access-Control-Allow-Methods', 'GET,HEAD,OPTIONS,POST,PUT"')
            ->header('Access-Control-Allow-Headers', 'Origin, Content-Type');        }
}

我遇到以下错误

  

CORS策略已阻止从来源“ http://127.0.0.1:8000/api/advertisement/31/upload-image”访问“ http://localhost:4200”处的XMLHttpRequest：在飞行前响应中，Access-Control-Allow-Headers不允许请求标头字段授权。 / p>

网络响应给我200响应码。因此，我将发布获得的标题。

Angular在localhost：4200上 Laravel在127.0.0.1:8000

bootstrap / app.php

<?php

/*
|--------------------------------------------------------------------------
| Create The Application
|--------------------------------------------------------------------------
|
| The first thing we will do is create a new Laravel application instance
| which serves as the "glue" for all the components of Laravel, and is
| the IoC container for the system binding all of the various parts.
|
*/

$app = new Illuminate\Foundation\Application(
    $_ENV['APP_BASE_PATH'] ?? dirname(__DIR__)
);

/*
|--------------------------------------------------------------------------
| Bind Important Interfaces
|--------------------------------------------------------------------------
|
| Next, we need to bind some important interfaces into the container so
| we will be able to resolve them when needed. The kernels serve the
| incoming requests to this application from both the web and CLI.
|
*/

$app->singleton(
    Illuminate\Contracts\Http\Kernel::class,
    App\Http\Kernel::class
);

$app->singleton(
    Illuminate\Contracts\Console\Kernel::class,
    App\Console\Kernel::class
);

$app->singleton(
    Illuminate\Contracts\Debug\ExceptionHandler::class,
    App\Exceptions\Handler::class
);

// $app->middleware([
//     Vluzrmos\LumenCors\CorsMiddleware
// ]);

/*
|--------------------------------------------------------------------------
| Return The Application
|--------------------------------------------------------------------------
|
| This script returns the application instance. The instance is given to
| the calling script so we can separate the building of the instances
| from the actual running of the application and sending responses.
|
*/

return $app;

Answer 1

您丢失了在“访问控制允许标题”中添加“授权”

->header('Access-Control-Allow-Headers', 'Origin, Content-Type, Authorization');

如果问题仍然存在，则可以实施vluzrmos/lumen-cors

Answer 2

尝试进行以下更正

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

出于安全原因，在迁移到生产环境时，请记住将星号（*）更改为生产环境URL

Answer 3

您应在X-Requested-With中添加Access-Control-Allow-Headers。

public function handle($request, Closure $next)
    {
        return $next($request)
            ->header('Access-Control-Allow-Origin', 'http://localhost:4200')
            ->header('Access-Control-Allow-Credentials', 'true')
            ->header('Access-Control-Allow-Methods', 'GET, HEAD, OPTIONS, POST, PUT')
            ->header('Access-Control-Max-Age', '3600')
            ->header('Access-Control-Allow-Headers', 'Origin, Accept, Content-Type, X-Requested-With');        }
}