如何正确地将自定义错误从后端(Express)传递到前端(Vue)

时间:2019-05-17 09:13:26

标签: node.js express vue.js sequelize.js axios

我正在开发一个基本的 Node 应用程序,并且遇到了一个问题,我认为这不是新问题,但我不知道这是解决问题的正确方法。我需要处理不是由代码,网络或数据库生成但由应用程序逻辑所需的那些错误。例如,我使用 已经注册的用户 ,但是在应用程序的不同情况下将需要相同的处理。

我从登录组件中的方法开始:

register () {
  API
    .register(this.credentials)
    .then(
      data => {
        this.user = data;
      },
      error => {
        this.error = error;
      })
    .catch(error => {
      this.error = error;
    });
},

API 是:

register (credentials) {
 return Axios
  .post('/auth/register',credentials)
  .then(response => {
    return response.data;
  })
},

后端是:

router.post('/auth/register',(req,res) => {
User.findOne({where:{username:req.body.username}})
  .then(user => {
    if (!user) {
      User
        .create(req.body)
        .then(user => {
          res.send(user);
        })
    } else {
      throw 'Username already exists';
    }
  });
});

我期望的是错误

  

抛出“用户名已经存在”;

(但可能是 未找到要搜索的数据 )传递回捕获它的组件并显示错误,而不是注册的用户。 我尝试在每个catch之后添加then或使用res.send({error:...})而不是引发,但是这样组件将错误消息显示为用户对象。

1 个答案:

答案 0 :(得分:3)

使用HTTP Status Codes通过HTTP传播错误:

后端:

router.post('/auth/register',(req,res) => {
console.log('backend register 3',req.body);
User.findOne({where:{username:req.body.username}})
  .then(user => {
    if (!user) {
      User
        .create(req.body)
        .then(user => {
          console.log('backend register 4',req.body);
          res.send(user);
        })
    } else {
      res.status(409).send('User already exists')
    }
  });
});

正面:

register (credentials) {
 return Axios
  .post('/auth/register',credentials)
  .then(response => {
    return response.data;
  })
  .catch(err => {
    processError(err);
  })
},