服务器端的错误消息未显示在前端

Question

当服务器端登录失败res.status(403).json({ fail: "Login failed" });消息从服务器端传递到前端setHelperText(failMessage);我如何在前端获得“登录失败”消息？

它在chrome控制台中显示错误>>错误：请求失败，状态码为403在createError（createError.js：16）在解决（settle.js：17）

server.js

app.post('/service/login', async (req, res) => {
  try {
    const userEmail = req.body.email;
    const userPassword = req.body.password;
    const loginData = await UserModel.findAll({ where: { email: userEmail} });
    const password = loginData[0].password;
    const email = loginData[0].email;
    if(password === userPassword && email === userEmail){
     const privilege  = loginData[0].privilege;
      res.status(200).json({ success: true, privilege, email });
    }else{
      res.status(403).json({ fail: "Login failed" });
    }
  } catch (e) {
    res.status(500).json({ message: e.message });
  }
});

Login.js

const fetchData = async () => {
  try {
    const res = await axios.post('http://localhost:8000/service/login', { email , password });
    console.log("Front End success message:"+res.data.success);
    if(res.data.success){
      setHelperText("Login successfully");
      setValue(res.data.privilege);
      setError(true);
    }
    else{
      const failMessage = res.data.fail;
      setHelperText(failMessage);
    }
  } catch (e) {
    console.log(e);
  }
}

Answer 1

如果响应失败，（在您的情况下为403，将执行catch块，因此将您的逻辑移到else块内以catch块为准