-1

I am getting a cors error for only delete request made from angular to laravel. Also while posting car model images fail to move to directory erros comes. I have created a CORS middleware and added to routes in api.php file. GET method is working

I have created a Mini Car Inventory System using laravel 5.8 and angular 7. I have hosted the backend on ooowebhost and frontend on heroku connected via github.

http://mincar-inventory.herokuapp.com/
https://github.com/Chandradas-Dessai/angCarInventory

CORS.php middleware

public function handle($request, Closure $next)
{
    header("Access-Control-Allow-Origin: *");
    //ALLOW OPTIONS METHOD
    $headers = [
        'Access-Control-Allow-Methods' => 'POST,GET,OPTIONS,PUT,DELETE',
        'Access-Control-Allow-Headers' => 'Content-Type, X-Auth-Token, Origin, Authorization',
    ];
    if ($request->getMethod() == "OPTIONS"){
        //The client-side application can set only headers allowed in Access-Control-Allow-Headers
        return response()->json('OK',200,$headers);
    }
    $response = $next($request);
    foreach ($headers as $key => $value) {
        $response->header($key, $value);
    }
    return $response;
}

api.php

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

Route::apiResource('/manufacturer', 'Api\v1\ManufacturerController')
->only(['index','show','destroy','store']);

Route::apiResource('/car-model', 'Api\v1\CarModelController')
->only(['index','show','destroy','edit','update','store']);

Route::apiResource('/inventory', 'Api\v1\InventoryController')
 ->only(['index','show','destroy','edit']);

Route::fallback(function(){
    return response()->json([
         'message' => 'Page Not Found.'], 404);
});

controller to delete

public function destroy($id)
{
    // $manufacturer->delete();
    // return Response()->json(["status"=>"success","message"=>"Manufacturer deleted successfully"]);
    //return response()->json();
    $manufacturer = Manufacturer::findorFail($id);

    if($manufacturer->delete()){
    return Response()->json(["status"=>"success","message"=>"Manufacturer deleted successfully!"]);
    }else{
        return Response()->json(["status"=>"error","message"=>"Unable to delete Manufacturer!"]);

 }

CORS error. Also unable to move image to directory in create car model

EstevaoLuis
  • 2,422
  • 7
  • 33
  • 40

2 Answers2

0

I guess that problem is with "Access-Control-Allow-Origin: *" header. Browsers have a problem with * as an origin. Set header to origin, that request came from.

  • I tried adding the origin name but its still not working – Chandradas Gauns Dessai Sep 13 '19 at 11:14
  • Sorry, I don't know. But I can tell, that is better to avoid cors if it is not necessary. – Jan Kremeň Sep 13 '19 at 11:35
  • It's better to use proxy on the same domain, that will redirect api requests to your api gateway. There are more problems with cors, that you may encounter. For example: https://stackoverflow.com/questions/42301884/safari-not-setting-cors-cookies-using-js-fetch-api – Jan Kremeň Sep 13 '19 at 11:38
0

You are not setting header of laravel request but you are setting it using with header function from php. Check my answer how your function should be

public function handle($request, Closure $next)
  {
      return $next($request)
          ->header('Access-Control-Allow-Origin', '*')
          ->header('Access-Control-Allow-Methods', 'POST, GET, OPTIONS, PUT, DELETE');
          ->header('Access-Control-Allow-Headers', 'Content-Type, X-Auth-Token, Origin, Authorization');
  }
Edison Biba
  • 4,384
  • 3
  • 17
  • 33