I'm facing a problem integrating my back end and front end. The back end is running on port 8080, and the front end is on 5173. My back end requests work perfectly when made in Postman or API Dog, but fail when made by the front end
The request code:
React.useEffect(() => {
async function request() {
const response = await fetch("http://localhost:8080/users", {
method: "POST",
headers: {
"Content-Type": "application/json",
},
body: JSON.stringify({
email: "[email protected]",
name: "Gabriel Ayres",
password: "12345",
}),
});
const json = await response.json();
console.log(response);
console.log(json);
}
request();
}, []);
When done, the request is blocked by the CORS policy(Access-Control-Allow-Origin)
So I tried to add mode: "no-cors" to the request. It solved the CORS problem, but now the request fails with error 415.
How can I solve this problem and use both my API and Frontend on the same machine?