Как валидировать ответы от API в redux (в частности react native)?

Question

[Вадим]

Приведу пример стандартного экшена для обращения к API:

const loginStart = () => {
    return {
        type: AUTH_LOGIN
    };
};

const loginSuccess = (payload) => {
    return {
        type: AUTH_LOGIN_SUCCESS,
        payload: payload
    };
};

const loginFail = (payload) => {
    return {
        type: AUTH_LOGIN_FAIL,
        payload: payload
    };
};

export const login = (data) => (dispatch) => {
    dispatch(loginStart());

    return fetch(API_ENDPOINT, {
        method: 'POST',
        headers: {
            Accept: 'application/json',
            'Content-Type': 'application/json',
        },
        body: JSON.stringify(data)
    })
        .then((response) => response.json())
        .then(
            (response) => {
                    dispatch(loginSuccess(response.response));
            }
        ).catch(
            (error) => {
                dispatch(loginFail(error));
            }
        );
};

Возник ряд вопросов с парсингом реквеста и тд.
1) Должен ли я доверять API и доверять тем данным, что оно возвращает?
Нужно ли делать проверки типа?
if (response.status == 'success') {}
или такую проверку

if (response.data) {} //убедиться что data точно есть

или следующую проверку:

if (response.data.token && response.data.token.length > 0) {} // Удостоверимся что токен есть в ответе

2) Как и где необходимо проверять ответы от сервера?
Если у пользователя пропал интернет, то реквест возвратит 500, необходимо ли обработать это в мобильном приложении?
Если я таки проверяю response от сервера, и он не совпадает с моими ожиданиями, как обрабатывать эти ошибки? Делать throw new Error() ? И ловить эти же ошибки в catch, на ряду с 500 400 ошибками?

3) В общем случае проверки на 500 400 или на status от api request будут повторяться, куда их выносить?
Может быть отдельный middleware или какой-то сервис отдельный написать для этого?

Answer 1

[Максим]

Начну с конца:

3) можно сделать функцию helper, типа check status
приведу пример кода из старого проекта (не async / await, но не суть)

export function checkStatus(response) {
  let json = response.json() // http://stackoverflow.com/a/29475662/1916578

  if (response.status >= 200 && response.status < 300) {
    return json
  } else {
    return json.then(window.Promise.reject.bind(window.Promise))
  }
}

export function httpGet(url) {
  return fetch(url, {
    headers: buildHeaders(),
  })
  .then(checkStatus)
}

и уже везде пользоваться httpGet для гетов, например. Конечно, можно расширить пример как вам нужно с необходимыми диспатчами и тд тп.

2) проверять необходимо всегда, чтобы пользователь понимал что происходит:
- вероятно у вас отпал инет
- на сервере ошибка, попробуйте еще раз

Думаю, стоит это начинать делать в catch у каждого запроса

1) если API не ваше - то делайте проверки, какие посчитаете нужными

Если API ваше, то проверки тоже необходимо делать, но в основном это нужно для обработки ошибок от сервера/сети.

Answer 2

[Димка Реактнативный]

Если у вас REST API, то учите Redux Saga
Если GraphQL API, то лучшее решение Apollo Сlient.
Эти библиотеки, в том числе, заточены под решения ваших задач.