I have a problem with a request to an API, I am using Laravel in the backend and Quasar for the Frontend, the error tells me the following:
I have already tried everything on the internet, videos, configure my Cors.php as follows:
public function handle(Request $request, Closure $next)
{
return $next($request)
->header('Access-Control-Allow-Origin', '*')
->header("Access-Control-Allow-Methods", "GET, POST, PUT, DELETE, PATCH, OPTIONS")
->header("Access-Control-Allow-Headers", "Content-Type, Authorization");
}
}
For the routes in api.php, I had it called as follows:Route::group(['middleware' => ['cors']], function () { });
I also had this problem, I'll tell you how I solved it.
Actually use two strategies, the first :
Create a
middleware
for the headersRemember that a
middleware
allows us to manage HTTP requestsin the middleware
You must include it in the file
Kernel.php
And inside your api routes,
api.php
You must declare all your endpoints in the following way:
Also modify the cors configuration file that is in the congig folder, called
cors.php
Quedo as follows:however, also install a google chrome extension to configure cross origins (cors) I leave it at the following link: Tool to configure cors
But that's not all , since I'm using React, I use
Axios
to make the requests, I make sure that all my requests contain the parameters in the header to avoid cross-origin errors (cors) in the following way:here I leave you another chrome extension to manage and test cors
Well this was the way that helped me to solve the cross-origin problems, the truth is that it was really tedious because I also tried many ways and none of them worked for me, I hope it works for you too.
Finally , in case it doesn't work for you, here is a repository with resources to manage the cors (I didn't get to test it because the above worked for me)
And most importantly the Cross-Origin Access Control Documentation