How to overcome the CORS issue in ReactJS

Question

I am trying to make an API call through Axios in my React Application.However, Iam getting this CORS issue on my browser. I am wondering if i can resolve this issue from a c

Answer 1

Another way besides @Nahush's answer, if you are already using Express framework in the project then you can avoid using Nginx for reverse-proxy.

A simpler way is to use express-http-proxy

1. run npm run build to create the bundle.

   var proxy = require('express-http-proxy');
   
   var app = require('express')();
   
   //define the path of build
   
   var staticFilesPath = path.resolve(__dirname, '..', 'build');
   
   app.use(express.static(staticFilesPath));
   
   app.use('/api/api-server', proxy('www.api-server.com'));
   

Use "/api/api-server" from react code to call the API.

So, that browser will send request to the same host which will be internally redirecting the request to another server and the browser will feel that It is coming from the same origin ;)