Setting up cors in laravel 5.3

Question

So I have the following middle ware:

<?php

namespace App\Http\Middleware;

use Closure;

class Cors {

    /**
     * Handle an incoming request.
     *
     * @param  \Illuminate\Http\Request  $request
     * @param  \Closure  $next
     * @return mixed
     */
    public function handle($request, Closure $next) {

        return $next($request)
            ->header('Access-Control-Allow-Origin', '*')
            ->header('Access-Control-Allow-Methods', 'GET, POST, PUT, DELETE, OPTIONS');
    }

}

Seems simple, its registered:

<?php

namespace App\Http;

use Illuminate\Foundation\Http\Kernel as HttpKernel;

class Kernel extends HttpKernel
{
    /**
     * The application's global HTTP middleware stack.
     *
     * @var array
     */
    protected $middleware = [
        // ...
        \App\Http\Middleware\Cors::class,
    ];

    /**
     * The application's route middleware.
     *
     * @var array
     */
    protected $routeMiddleware = [
        'cors' => \App\Http\Middleware\Cors::class,
        // ...
    ];
}

The route uses it:

Route::group([
    'prefix'     => 'api/v1/',
    'middleware' => 'cors'
], function() {
    // ...
});

Yet the console states:

Fetch API cannot load http://examplesite.local/api/v1/blogs?_sort=id&_order=DESC&_start=0&_end=10. Request header field content-type is not allowed by Access-Control-Allow-Headers in preflight response.

last I checked this was the proper way to set up cors in Laravel 5.3, So unless I am horribly mistaken ....

I can click the link for the api request in the net work tab of chrome and it opens a new tab showing me the result of the api, which is a json response.

yet javascript assumes that cors is not enabled?

Answer 1

Looking at the last line of your error I guess you are missing the content-type header in your server side. Try adding this line to your headers and see if it works:

->header('Access-Control-Allow-Headers', 'Content-Type, X-Auth-Token, Origin');

You could also have a look at this answer.