Как обработать>400 ответов в вызовах API из приложения Redux?

В настоящее время я использую fetch совершать вызовы API в моем приложении

Я попытался построить API промежуточного программного обеспечения:-

export function api(endpoint,method,isAuth=false,body=null,multiPart=false,initToken=null)
{
  let promise = null
  let myHeaders = new Headers();
  if(!multiPart){
    myHeaders.append("Content-Type", "application/json");
  }


  if(isAuth){
    //if authorizations is needed adding header
      const accessToken = authentication.getAccessToken()
      myHeaders.append("Authorization",accessToken)
  }

  if(initToken){
    // in case of initToken adding to Authorization
    console.log("here"+initToken)
    myHeaders.append("Authorization",initToken)
  }

  let myInit = { method: method,headers: myHeaders};

  myInit['method'] = method
  myInit['headers'] = myHeaders

  if(body){
      myInit['body'] = body
  }


  let request = new Request(constants.BASE_URL+endpoint,myInit);
  promise = fetch(request)

  return promise
}

Я добавляю вышеупомянутое в моем thunk с extraArguments

export default function configureStore(initialState) {
  const store=createStore(
    rootReducer,
    initialState,
    compose(
      applyMiddleware(thunk.withExtraArgument(api),createLogger()),
      DevTools.instrument()
    ))
  return store
}

Следуя в моем действии, которое вызывает API:-

export function fetchEmployeeInformation(){
  return (dispatch,getState,api) => {
        const endPoint = '//url'
        const  method = 'GET'
        const isAuth = true
        const promise = api(endPoint,method,isAuth)
        promise
        .then(response =>
          response.json().then(json => ({
            status:response.status ,
            json
          })
        ))
        .then(
          ({ status, json }) => {
            if( status >= 200 && status < 300) {
               //success
            }
            if (status >= 400 ) {
                //throw error
            }
          },
          err => {
            console.log("error"+err);
          }
        );
  }
}

Итак, мой вопрос здесь заключается в том, есть ли какой-нибудь пакет, например $ http, в angularjs, который я могу использовать с моим приложением Reaction-Redux. Я имею в виду, если код состояния находится в диапазоне 200-299, он должен быть успешным, иначе возникнет ошибка.

С fetch я вижу, что он не заботится о коде, и я должен специально проверить, является ли диапазон кода выше>400, а затем выдать ошибку.

Есть ли лучший способ справиться с этим?

Источник

2 ответа

Решение

Библиотека axios имеет такой же поток, как Angular $http, включая requestInterceptor а также responseInterceptor, Читать больше документов

Источник

Вы также можете попробовать фрисби, которая является fetch API-оболочка. Как только вы получите response объект, вы можете проверить наличие err или ok булево свойство.

Асинхронный пример:

const api = new Frisbee({
   baseURI: 'https://yourapiurl.com'
})
const rs = await api.get(`url`)
if (rs.ok) {
  console.log('success')
} else {
  console.log('failure', rs.err)
}

Фрисби также отлично работает с нодами и React Native.

Источник
Другие вопросы по тегам