Обработка ошибок с асинхронным ожиданием и редукцией

Question

Я хочу создать отдельный класс, который будет обрабатывать все мои API-запросы, сообщения и т. Д. Для моих редукционных действий, как это иногда делается, таким образом, мой код действия редукса более минималистичен и выполняет меньше работы.Однако, когда возникают ошибки, я должен убедиться, что мои действия перехватывают эти ошибки и правильно отправляют их в мой соответствующий редуктор.Я путаюсь с тем, что сама моя функция API также отлавливает ошибки, и мне интересно, что если ошибка произойдет первой, будет ли она сначала обнаружена в моей функции API, и, таким образом, я не улавливаю ошибку в своей функции действия, поэтому никогдаотправить указанную ошибку?Как мне избежать этой проблемы?Могу ли я не отлавливать ошибки в моей функции API, а просто перенаправить их как-нибудь на мои действия?Или мне нужно отправить requestDataFailure в мою функцию API?Спасибо.

Действие:

export const fetchData = () => async (dispatch) => {
  dispatch(requestData());
  try {
    const json = await ApiClass.getData();
    dispatch(receiveData(json.data));
  } catch (error) {
    dispatch(requestDataFailure(error));
  }
};

Класс API:

import HttpService from './httpServce';

export default class ApiClass {
  static async getData() {
    try {
      const response = await HttpService.get('api/get-data');
      return response.json;
    } catch (error) {
      throw Error(error.message);
    }
  }
}

Answer 1

Они будут (в конечном итоге) все всплывают в соответствии с вашим основным методом.

В вашем ApiClass вы по существу выбрасываете любую ошибку, так что она всплывет в вашу fetchData функцию и будет пойманаэтим блоком.

У вас есть несколько способов сделать это:

• Сохраните попытку / ловлю в вашем ApiClass и используйте это для более «дружественных» сообщений об ошибках.Возьмите ошибку из вашего HttpService.get и, возможно, прочитайте вывод json с сервера (если это не что-то вроде ошибки 500) и сгенерируйте разные ошибки в зависимости от результата.Например:

class ProductNotFound extends ApiError {
  constructor(name) {
    super(`This product: '${name}' was not found.`);
  }
}

export default class ApiClass {
  static async getProducts() {
    try {
      const response = await HttpService.get('api/get-products');
      return response.json;
    } catch (error) {
      if (error.code === 404) {
        throw new ProductNotFound();
      }
      // Check if error.response contains valid json, and if so, output a server side message?

      // Unknown error, just throw
      throw ApiUnknownError(error.message);
    }
  }
}

Теперь вы можете просто использовать requestDataFailure и передать error.message и отобразить его конечному пользователю.

• Или, альтернативноВы можете просто return response.json; не обернуться в блок try / catch.Когда HttpService.get отклоняется, выдается ошибка, и вы можете просто использовать error.message, чтобы получить необработанное сообщение об ошибке HttpService.get.Выполните любые действия притока, основанные на этом.