CORS Issue with external API - Works via PostMan but not HTTP request with Axios [duplicate] CORS Issue with external API - Works via PostMan but not HTTP request with Axios [duplicate] vue.js vue.js

CORS Issue with external API - Works via PostMan but not HTTP request with Axios [duplicate]


You can fix this error using this

    return axios(url, {      method: 'GET',      mode: 'no-cors',      headers: {        'Access-Control-Allow-Origin': '*',        'Content-Type': 'application/json',      },     credentials: 'same-origin',    }).then(response => {      console.log(response);    })

In your API please add a cors Middleware

  <?php namespace App\Http\Middleware; use Closure;class CORS {/** * Handle an incoming request. * * @param  \Illuminate\Http\Request  $request * @param  \Closure  $next * @return mixed */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'    ];    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; }}

Add Middleware in app\Http\Kernel.php

 protected $routeMiddleware = [    'cors' => 'App\Http\Middleware\CORS',];

Then you can use this in routes

Route::get('/', function () {`enter code here`})->middleware('cors');