React won’t call backend (Node) due to CORS error

Our client side application, When requesting to Login, sends a CORS issue. The API fails with CORS error: Preflight Wildcard origin not allowed . This is a Post request. We have started sharing cookies with the client, and this issue started coming up suddenly.

What we have added :

  1. We have added the WithCredentials: true [client side]
  2. On the server side, We have included the res.header with almost all access control allow values. And none of them is a wildcard character. (screenshots added) .

We’re not using a wildcard in any Header, still the API throws this error for CORS wildcard not allowed.

Server side Code : enter image description here

enter image description here

Client Side API call.:

enter image description here


UPDATE: We were able to solve this issue by adding the Allow origin to our CORS library value we were using (when the server boots up). The CORS library (I don’t know how and why but) overrides the assigned Origin by “*” if nothing is provided.

app.use(cors({credentials: true, origin: 'http://localhost:3000'}))

Answer

This can be solved by allowing origin to our CORS library being used (when the server boots up). The CORS library (I don’t know how and why but) overrides the assigned Origin by “*” if nothing is provided.

app.use(cors({credentials: true, origin: 'http://localhost:3000'}))

Leave a Reply

Your email address will not be published. Required fields are marked *