Dealing with CORS in "Create React App"

React Web Development Course
#1

Hi Zsolt, great React course!

I want to profound my knowledge about React.
I was searching for “how to deal with CORS in React.js”, but I didn’t found the answer.

As far I understand we need to create an intermediate server with

dependencies:  {
    cors,
    express,
    request,
    request-promise
}

Error example:

Access to XMLHttpRequest at 'https://api.binance.com/api/v3/order?symbol=BTCUSDT&side=BUY&type=LIMIT&timeInForce=GTC&quantity=0.001&price=5000&recvWindow=60000&timestamp=1596317131721&signature=43709cc7b0576dff468741b2b7e9069c5fd8b7b4c781b534684a8fe36ba32e13' from origin 'https://kkcrypto.github.io' has been blocked by CORS policy: Request header field content-type is not allowed by Access-Control-Allow-Headers in preflight response.

I hope that you could maybe point me to some solution.

Thank you

1 Like
#2

Thanks, I’m glad you like the course.

Yes, you may need to use a proxy for eliminating CORS errors.

While you are experimenting on localhost, you can simply enable some urls, ports in package.json. Example: https://www.telerik.com/blogs/dealing-with-cors-in-create-react-app.

Further reading on the generic, when you are not just developing, but you also host: https://create-react-app.dev/docs/proxying-api-requests-in-development/

2 Likes