Question 258170 in Reactjs Question posted in
The new location for the React Documentation can be found here.

Reactjs – CORS Error for POST Requests from React to Ballerina Server

I have a local Ballerina server (http://localhost:8080) and React frontend (http://localhost:3000) set up, and I’ve encountered a CORS error while attempting to send POST requests to the server through axios. Interestingly, I don’t encounter this error when making the same requests through Postman.

Following is the CORS error:

Response to preflight request doesn't pass access control check: 
No 'Access-Control-Allow-Origin' header is present on the requested resource.

How can I solve this problem ?

Tags:

2

Answers


  1. Chosen as BEST ANSWER
    0

    Postman doesn't validate the CORS headers. However, browsers do validate them as a security measure to protect against cross-site requests. To resolve this CORS error, add 'http://localhost:3000' to the CORS configuration of the service. Here's an example of how to configure it:

    @http:ServiceConfig {
    cors: {
        allowOrigins: ["http://localhost:3000"]
    }
}
service / on new http:Listener(8080) {

}

    This configuration will allow requests from the React app running on 'http://localhost:3000' to access the Ballerina server without encountering CORS issues.


  2. 0

    if u use google chrome:

    google-chrome --user-data-dir=/home/<your username>/.config/google-chrome --disable-web-security
    Login or Signup to reply.
Please signup or login to give your own answer.

Back To Top
Search