I'm creating an application, the front end in React JC and I have a basic REST api made with Node JS. When I try fetch data from localhost:3001/user/:id for example on postman - everything works 100%.
But when I try to fetch it on my front end in React (the react app is hosted on localhost:3000/), it delivers the following error:
"Failed to load localhost:3001/user/5b21a5d7588b40be612798d4: Cross origin requests are only supported for protocol schemes: http, data, chrome, chrome-extension, https."
The relevant code where I'm trying to fetch the data on my front end (with Axios is here):
componentDidMount () {
axios.get("localhost:3001/user/5b21a5d7588b40be612798d4").then(response => {
console.log(response);
})
}
You need a browser plugin that allows cross origin resource sharing. You'll need to turn it on, and then it should work.
Keep in mind, a lot of sites disable their services when you have it on for security reasons, like YouTube. So only keep it on while working on your project.