Axios + reactJS+ passportJS 登录重定向不起作用？

Question

I'm trying to implement user authentication for the first time, I can't get the redirect to work after a successful login.

Function in react:

 const login = () => { Axios({ method: "POST", data: { email: loginEmail, username: loginEmail, password: loginPassword, }, withCredentials: true, url: "http://localhost:5000/login", }).then((res) => console.log(res)); };

Backend user controller:

 exports.login = (req, res) => { const { email, name, username, password } = req.body; const user = new User({ email, name, username }); req.login(user, (err) => { if (err) return next(e); console.log("LOGGED IN") res.redirect('/'); }); };

The console messages do print when I enter a valid user/password, but I just can't get the page to redirect after a successful log in. I've tried using history.push instead of redirecting from the backend, but it would push regardless of whether or not the log in is successful.

 const login = () => { Axios({ method: "POST", data: { email: loginEmail, username: loginEmail, password: loginPassword, }, withCredentials: true, url: "http://localhost:5000/login", }).then(history.push("/")); };

Does anyone have any insight of why I am unable to redirect from the backend? How can I better approach this?

Answer 1

Try this..

const login = async () => {
            const res = await Axios({
              method: "POST",
              data: {
                email: loginEmail,
                username: loginEmail,
                password: loginPassword,
              },
              withCredentials: true,
              url: "http://localhost:5000/login",
            });
           // if success
          history.push("/");
        };

Answer 2

In backend user controller instead of res.redirect send res.send(// if authentication is completed send true, else send false) .

Now you can access this message in then function.

const login = () => {
    Axios({
      method: "POST",
      data: {
        email: loginEmail,
        username: loginEmail,
        password: loginPassword,
      },
      withCredentials: true,
      url: "http://localhost:5000/login",
    }).then((res) => {(res.data===true) && (history.push("/"))});
};