[FIXED] Laravel Access to XMLHttpRequest at from origin has been blocked by CORS policy

Issue

When I send a call from an Angular application to Laravel, I am getting the below issue

Access to XMLHttpRequest at 'http://localhost:8083/api/login_otp' from origin 'http://localhost:4200' has been blocked by CORS policy: Request header field ip is not allowed by Access-Control-Allow-Headers in preflight response.

I found a solution and did the below changes in CROS.php

public function handle($request, Closure $next)
    {
        return $next($request)
        ->header('Access-Control-Allow-Origin', '*') 
        ->header('Access-Control-Allow-Methods', 'GET, POST, PATCH, PUT, DELETE, OPTIONS')
        ->header('Access-Control-Allow-Headers', 'Origin, Content-Type, X-Auth-Token, Authorization, X-Requested-With, x-xsrf-token');
    }

I added x-xsrf-token in Access-Control-Allow-Headers, but I am still getting the same error.

Solution

Read the error message:

Request header field ip is not allowed by Access-Control-Allow-Headers

It says ip is not allowed.

Look at your code:

'Origin, Content-Type, X-Auth-Token, Authorization, X-Requested-With, x-xsrf-token'

Your code doesn't mention ip.

Add ip to the list of allowed headers.

Answered By - Quentin