Почему axios не возвращает ответ API при появлении ошибки?

Question

Я использую React с Редукс-сагой.

У меня есть простой запрос /GET. Однако, если API выдает какую-либо ошибку, например, 400 bad request, Я не могу получить ответ, возвращенный моим API.

Пример - /getUsers возвращает 400 bad request и ответ "Your form is invalid". Я вижу это в сети, что это было правильно возвращено. Однако по моему try catch:

catch((error) => console.log(error.message))

- это всегда Network Error. Я не хочу отображать пользователю Network Error, но ответ возвращается API.

Вопрос:

Как получить правильное сообщение об ошибке ответа API?

• функция запроса:

  const getUsers = () => api.get(URL);
  

• Эксиос экземпляр

  const api = axios.create();
  

• функция саги (только пример)

  try {
     yield call(getUsers);
  } catch(error) {
     yield put(getUsersFail(error.message));
  }
  

Answer 1

Сначала мы должны получить ответ от вызова axios и проверить его статус. Если это ошибка 400, выдает ее и ловит.

try {
  const response = yield call(api.get, url)

  if (response.status >= 200 && response.status < 300) {
    yield put({ type.TYPE, response })
  } else {
    throw response
  }

} catch(error) {
   // API response error message
   yield put({type.TYPE_ERROR, error.message})
}