'Cannot save email in React.js + Express

So I have a function getProfile(). Inside it I am trying to fetch users from the server using a POST call, however it's throwing a CORS error in its response.

Here is the getProfile:

const getProfile = async () => {
  try {
    const res = await fetch("http://localhost:5000/dashboard/", {
      method: "POST",
      headers: {
        jwt_token: localStorage.token,
        "Content-Type": "application/json",
        Accept: "application/json",
      },
    });

    const parseData = await res.json();
    setEmail(parseData.email);
    console.log("Try success");
    console.log(parseData.email);
  } catch (err) {
    console.log("Try failed");
    console.error(err.message);
  }
};


Solution 1:[1]

if you are handling your nodeServer by your own you need to add CORS package please check this and follow their docs https://www.npmjs.com/package/cors

1.install package 2. in your app.js file add following

var cors = require('cors')
app.use(cors())

and change you frontend function getProfile() to following:

const getProfile = async () => {
    let token = localStorage.getItem("token");
    const myHeaders = new Headers();
    myHeaders.append("Content-Type", "application/json");
    myHeaders.append("Authorization", "bearer" + token);
    try {
      await fetch("http://localhost:5000/dashboard/", {
        method: "POST",
        headers: myHeaders,
      })
        .then((r) => r.json().then((data) => ({ status: r.status, data })))
        .then((obj) => obj.status === 200 && console.log("data", obj.data));
    } catch (err) {
      console.error("Try failed", err.message);
    }
  };

Sources

This article follows the attribution requirements of Stack Overflow and is licensed under CC BY-SA 3.0.

Source: Stack Overflow

Solution Source
Solution 1