Cross-Origin Request while using a post request from Ionic to Laravel

Question

I'm trying to send a post request from my frontend ( Ionic ) to my backend Laravel ! it return that Cors error. I've already made the Cors class in Laravel and added it the routeMiddleware, I have also tried the solution made by barryvdh and it's also not working. when I try the request using the get method it works but it's not the same case while using post method.

here my handle method in Cors class in laravel :

public function handle($request, Closure $next)
   {
        header("Access-Control-Allow-Origin: *");

       // ALLOW OPTIONS METHOD
       $headers = [
           'Access-Control-Allow-Origin'=> '*',
           'Access-Control-Allow-Methods'=> 'POST, GET, OPTIONS, PUT, DELETE',
           'Access-Control-Allow-Headers'=> 'Content-Type, X-Auth-Token, Origin'
       ];
       if($request->getMethod() == "OPTIONS") {
           // The client-side application can set only headers allowed in Access-Control-Allow-Headers
           return Response::make('OK', 200, $headers);
       }

       $response = $next($request);
       foreach($headers as $key => $value)
           $response->header($key, $value);
       return $response;
   }

middleware array in Kernel.php

    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,
        \App\Http\Middleware\Cors::class,

    ];

api part of the middlewareGroups array in Kernel.php

       'api' => [
            'throttle:60,1',
            'bindings',
            \App\Http\Middleware\Cors::class,
        ]

routeMiddleware array in Kernel.php

    protected $routeMiddleware = [
        'auth' => \App\Http\Middleware\Authenticate::class,
        'auth.basic' => \Illuminate\Auth\Middleware\AuthenticateWithBasicAuth::class,
        'bindings' => \Illuminate\Routing\Middleware\SubstituteBindings::class,
        'cache.headers' => \Illuminate\Http\Middleware\SetCacheHeaders::class,
        'can' => \Illuminate\Auth\Middleware\Authorize::class,
        'guest' => \App\Http\Middleware\RedirectIfAuthenticated::class,
        'signed' => \Illuminate\Routing\Middleware\ValidateSignature::class,
        'throttle' => \Illuminate\Routing\Middleware\ThrottleRequests::class,
        'verified' => \Illuminate\Auth\Middleware\EnsureEmailIsVerified::class,
        'jwt.auth' => Tymon\JWTAuth\Http\Middleware\Authenticate::class,
        'jwt.refresh' => Tymon\JWTAuth\Http\Middleware\RefreshToken::class,
        'cors' => \App\Http\Middleware\Cors::class,
    ];

The route I'm trying to call

  Route::post('auth/login', 'ApiController@login');

Here the code I'm executing in ionic

  login(emaill: string, passwordd: string) {
    return this.http.post<any>(      
      `${environment.laravelBackend}/auth/login`,
      { email: emaill, password: passwordd}
    );
  }

Anyone knows how I can make this work ? Thanks in advance

I know this is not exactly your answer but take a look at github.com/barryvdh/laravel-cors and you can stop reinventing the wheel — AH.Pooladvand
@AH.Pooladvand I've already tried that solution but it's not working, I think the problem comes from Ionic — Yassir Akhmis

Hardik Davra Hardik Davra · Accepted Answer · 2019-09-30T06:19:35

there may be 2 solutions try both if first or second does not work.

1) Sometime, it not works due to the developer's composer version where the API is made, and the machine where you have setup the environment's composer version is different. check it. and if possible, send your and the machine where api is developed's composer version.

2) Add CORS in .htaccess File like this

Header set  Access-Control-Allow-Origin "*"
Header set  Access-Control-Allow-Methods "GET,POST,PUT,DELETE,OPTIONS"
Header set Access-Control-Allow-Credentials "true"

Cross-Origin Request while using a post request from Ionic to Laravel

1 Answers