Ad

Larvel 5.8: Middleware Ignored When Calling Route From Javascript But Not From Browser

- 1 answer

I've a 'cors' middleware that simply does this

public function handle($request, Closure $next)
{
    // return response()->json(['message' => 'Not Found.'], 404);
    if (config('app.env') !== 'production') {
        return $next($request)
                ->header("Access-Control-Allow-Origin", "*")
                ->header('Access-Control-Allow-Methods', 'GET, POST, PUT, DELETE, OPTIONS');
    } else  {
        return $next($request);
    }

}

I added the middleware into routes/api.php in this way:

<?php

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

    ... wrapping all /api/v1 routes

}

When I visit an url from my browser, I see in developer options that

enter image description here

But, when javscript call the same url, the 'option' preflight request fails

Access to XMLHttpRequest at 'https://project.local/api/v1/customer' from origin 'https://localhost:3000' 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.

What am I doing wrong?

Note that asking laravel to list my routes, actually shows that cors is applied !

php artisan route:list --path api/v1/
+--------+-----------+-------------------------------+------------------+----------------------------------------------------------+---------------------+
| Domain | Method    | URI                           | Name             | Action                                                   | Middleware          |
+--------+-----------+-------------------------------+------------------+----------------------------------------------------------+---------------------+
|        | GET|HEAD  | api/v1/customer               | customer.index   | App\Http\Controllers\[email protected]            | api,cors,jwt.verify |
|        | POST      | api/v1/customer               | customer.store   | App\Http\Controllers\[email protected]            | api,cors,jwt.verify |
|        | GET|HEAD  | api/v1/customer/{customer}    | customer.show    | App\Http\Controllers\[email protected]             | api,cors,jwt.verify |
|        | PUT|PATCH | api/v1/customer/{customer}    | customer.update  | App\Http\Controllers\[email protected]           | api,cors,jwt.verify |
|        | DELETE    | api/v1/customer/{customer}    | customer.destroy | App\Http\Controllers\[email protected]          | api,cors,jwt.verify |
Ad

Answer

Please update your middleware with additional headers,

 if (config('app.env') !== 'production') {
        return $next($request)
                ->header("Access-Control-Allow-Origin", "*")
                ->header('Access-Control-Allow-Methods', 'GET, POST, PUT, DELETE, OPTIONS');
                ->header('Access-Control-Allow-Headers', 'Content-Type, Authorization, X-XSRF-TOKEN, X-Requested-With');

This should fix the issue.

Ad
source: stackoverflow.com
Ad