AuthorWrite something about yourself. No need to be fancy, just an overview. ArchivesCategories |
Back to Blog
It can easily be done by adding this to your root file in server. You can add the mentioned HTTP header to your response from the server to not get such errors anymore. We need to add our frontend endpoint on it so it can send all its data to us upon request. It also says, no Access-Control-Allow-Origin header is present in which is a HTTP header which says which origins can have access to our data. Its trying to say that our origin is blocked by CORS policy so we can't access the data from backend. It didn't work online although my prod succeeded and everything worked locally. ![]() The routes were different as I couldn't grab the screenshot of my own error, but the message was same. But once I went to production my app stayed in its loading state and my console showed up these errors. ![]() I was completely unknown regarding cors, so I wrote my express app and added a proxy in React's package.json to get access to the backend routes in development. No Access Control Allow Origin header is present ![]() Now I'll walk you through all the CORS errors that kept me up at night this week and how to fix each one of them. That's where the concept of CORS comes in. This is a security measure we take to protect our clients from CSRF attacks. For instance, if your frontend is hosted on a different platform than your backend so you'd need to make HTTP requests to get your data from there, which the browser blocks by default (as its hosted on a cross-origin, not same-origin). CORS stands for Cross Origin Resource Sharing, which uses additional HTTP headers to tell browsers to give a web application running at one origin, access to resources from different origin.
0 Comments
Read More
Leave a Reply. |