I make react project with laravel Back-end ... I have a CORS problem, I do everything like on link below, with fruitcake.

Laravel 6 CORS policy issue with API but still not working.

cors.php:

 'paths' => ['api/*'], /* * Matches the request method. `[*]` allows all methods. */ 'allowed_methods' => ['*'], /* * Matches the request origin. `[*]` allows all origins. */ 'allowed_origins' => ['*'], /* * Matches the request origin with, similar to `Request::is()` */ 'allowed_origins_patterns' => [], /* * Sets the Access-Control-Allow-Headers response header. `[*]` allows all headers. */ 'allowed_headers' => ['*'], /* * Sets the Access-Control-Expose-Headers response header. */ 'exposed_headers' => false, /* * Sets the Access-Control-Max-Age response header. */ 'max_age' => false, /* * Sets the Access-Control-Allow-Credentials header. */ 'supports_credentials' => false, 

And, kernel middle-ware is:

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

what else could be the problem?

5 Answers

Here are some gotchas when using fruitcake/laravel-cors:

  • Put HandleCors middleware at the top of $middleware in app/Http/Kernel.php:
protected $middleware = [ \Fruitcake\Cors\HandleCors::class, \App\Http\Middleware\TrustProxies::class, \App\Http\Middleware\CheckForMaintenanceMode::class, \Illuminate\Foundation\Http\Middleware\ValidatePostSize::class, \App\Http\Middleware\TrimStrings::class, \Illuminate\Foundation\Http\Middleware\ConvertEmptyStringsToNull::class, ]; 

Putting it at the bottom or somewhere between won't work because requests might be rejected by other middlewares with higher priority.

  • Do NOT die or exit in controller.

For example the following won't work:

Route::get('/cors-test', function() { dd("This won't work"); }); 

Because Fruitcake\Cors\HandleCors::handle method adds relevant headers AFTER handling request:

Fruitcake\Cors\HandleCors.php

public function handle($request, Closure $next) { // --- omitted // Handle the request $response = $next($request); // <--- if you die here if ($request->getMethod() === 'OPTIONS') { $this->cors->varyHeader($response, 'Access-Control-Request-Method'); } // you will never reach here return $this->addHeaders($request, $response); } 

dump does not work either

  • Clear config cache after changing app/config/cors.php:
$ php artisan config:cache 
2

The Fruitcake\Cors\HandleCors::class is troublesome. Just remove it from everywhere and add these 3 headers in api.php route file on the top.

header('Access-Control-Allow-Methods: GET, POST, PATCH, PUT, DELETE, OPTIONS'); header('Access-Control-Allow-Headers: Origin, Content-Type, X-Auth-Token, Authorization, Accept,charset,boundary,Content-Length'); header('Access-Control-Allow-Origin: *'); 
5
php artisan config:clear php artisan route:clear php artisan cache:clear 

Make sure your permissions are setup correctly (eg. storage is writable)

Actually ,just remove dd and die command from you code.

1

Add credentials: 'same-origin' to your request header in the react App

Your Answer

Sign up or log in

Sign up using Google Sign up using Facebook Sign up using Email and Password

Post as a guest

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge that you have read and understand our privacy policy and code of conduct.