如何在React / Redux中显示Node / Express的自定义错误消息?

时间:2017-10-26 12:27:34

标签: node.js reactjs express redux passport.js

我正在使用passportjs进行用户身份验证,如果身份验证失败,我想显示在客户端呈现的自定义错误消息(在本例中为React / Redux)。

路线:

app.post(
    '/api/login',
    (req, res) => {
      passport.authenticate('local-login', (err, user, info) => {

        if (!user) return res.status(400).send({ msg: 'Please verify account first' });

      })(req, res);
    }
  );

行动创作者:

export const loginUser = (values, history) => async dispatch => {
  try {
    const res = await axios.post('/api/login', values);
    dispatch(deleteMessage());
    dispatch({ type: FETCH_USER, payload: res.data });
    history.push('/');
    window.Materialize.toast(`Welcome back ${res.data.local.email}!`, 4000);
  }
  catch(err) {
    console.log('Error:', err);
  }
}

当我发现错误并且控制台将其注销时,我收到标准状态400错误消息而不是:{ msg: 'Please verify account first' }

Error: Request failed with status code 400
    at createError (createError.js:16)
    at settle (settle.js:18)
    at XMLHttpRequest.handleLoad (xhr.js:77)

是否有更好的方法来显示自定义错误消息?

3 个答案:

答案 0 :(得分:4)

  

console.log(error)修改为console.log(error.response)   捉。

参考:https://github.com/axios/axios/issues/960#issuecomment-309287911

答案 1 :(得分:0)

你必须在变量 res 的范围内,我建议采用以下方法(在.catch()之外):

if(res.status === 400) {
  const error_msg = res.msg
  dispatch(loginError(error_msg))
}

答案 2 :(得分:0)

console.log('Error:', err);

你也可以改变这个你想要的任何错误信息。或者您希望服务器的响应err{ msg: 'Please verify account first' }