Как правильно передать пользовательские ошибки из Backend (Express) в Frontend (Vue) - PullRequest
Новая
       22

Как правильно передать пользовательские ошибки из Backend (Express) в Frontend (Vue)

1 голос
/ 17 мая 2019

Я занимаюсь разработкой базового приложения 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';
    }
  });
});

Я ожидаю, что ошибка

throw 'Имя пользователя уже существует';

(но это может быть Данные для вашего поиска не найдены ) передаются обратно компоненту, который его перехватывает и показывает ошибку вместо зарегистрированного пользователя. Я пытаюсь добавить catch после каждого then или использовать res.send({error:...}) вместо throw, но таким образом компонент показывает сообщение об ошибке как пользовательский объект.

1 Ответ

3 голосов
/ 17 мая 2019

Используйте Коды состояния HTTP для распространения ошибок по 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);
  })
},
...