CODEWITHSUNDEEP
reactjslaravelreact-reduxcorslaravel-middleware
Qli
Qli

Reputation: 189

Laravel CORS with Fruitcake

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?

Upvotes: 9

Views: 43038

Answers (5)

glinda93
glinda93

Reputation: 8489

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

Upvotes: 12

user15521531
user15521531

Reputation:

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

Upvotes: -1

Sadiq Lukman
Sadiq Lukman

Reputation: 1

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

Upvotes: -2

Ankit Singh
Ankit Singh

Reputation: 912

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: *');

Upvotes: 4

Saul Mamani
Saul Mamani

Reputation: 35

php artisan config:clear
php artisan route:clear
php artisan cache:clear

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

Upvotes: -1

Related Questions