0

API : Laravel and MongoDB for database Front : NuxtJs and Vuetify

I have my own API. When I test my routes on Postman, I had cors error, but I solved with this code in file routes api.php.

header('Access-Control-Allow-Origin:  *');
header('Access-Control-Allow-Methods:  POST, GET, OPTIONS, PUT, PATCH, DELETE');

Maybe, there is a better file to put this code. But I work with Postman. If I need to move this code, tell me please.

Now, my actual problem, on my front site, when i want sign up a new user, I have this error

Blocage d'une requête multiorigine (Cross-Origin Request) : la politique « Same Origin » ne permet pas de consulter la ressource distante située sur http://127.0.0.1:8000/api/register. Raison : l'en-tête « content-type » n'est pas autorisé d'après l'en-tête « Access-Control-Allow-Headers » de la réponse de pré-vérification des requêtes CORS.

Access to XMLHttpRequest at 'http://127.0.0.1:8000/api/register' from origin 'http://localhost:3000' has been blocked by CORS policy: Request header field content-type is not allowed by Access-Control-Allow-Headers in preflight response.

In my file : config/cors.php I have :

'paths' => ['api/*', 'sanctum/csrf-cookie'],

    'allowed_methods' => ['*'],

    'allowed_origins' => ['*'],

    'allowed_origins_patterns' => [],

    'allowed_headers' => ['*'],

    'exposed_headers' => [],

    'max_age' => 0,

    'supports_credentials' => false,

];

Thanks for your help

Edit Resolved

I have found the answer. I just add : Access-Control-Allow-Headers: 'Content-Type' in api.php

header('Access-Control-Allow-Origin: *'); header('Access-Control-Allow-Methods: POST, GET, OPTIONS, PUT, PATCH, DELETE'); header('Access-Control-Allow-Headers: Content-Type') ;
  • I didn't think Postman needed CORS responses ... you learn something new here every day – Bravo Jul 04 '22 at 10:55
  • you'll need to learn about pre-flight - the server needs to respond to the request method "OPTIONS" and issue the appropriate `Access-Control-Allow-Headers` in the response to this preflight request, along with the other CORS headers as appropriate - alternatively, send the request with a `content-type` that does not trigger preflight – Bravo Jul 04 '22 at 10:57
  • Please read [ask] and provide a [mcve]. In particular, should should provide the code that sends the request (because `withCredentials` makes a difference here) and you should use the Network tab of your browsers development tools to look at the response to the preflight to see what the `Access-Control-Allow-Headers` value actually is (which will tell you if the config you provided is bring picked up correctly). – Quentin Jul 04 '22 at 10:59
  • I have found the answer. I just add : Access-Control-Allow-Headers: 'Content-Type' in api.php header('Access-Control-Allow-Origin: *'); header('Access-Control-Allow-Methods: POST, GET, OPTIONS, PUT, PATCH, DELETE'); header('Access-Control-Allow-Headers: Content-Type') ; – Thibault PERONNO Jul 04 '22 at 11:48

0 Answers0