使用apisauce处理redux应用程序中的401错误

Question

问题是:我有很多sagas没有处理401错误的响应状态，现在我必须处理它。我有一个基于apisause的服务，我可以用它编写一个响应监视器来处理401错误(就像axios中的拦截器)。但是，我不能分派任何操作来存储重置用户数据，例如，因为在apiservice中没有存储上下文。如何在服务层使用调度功能？或者在每个传奇中使用put()函数，当我收到401响应状态时，是唯一正确的方法吗？

Answer 1

您可以在“apisauce”拦截器中使用refs来使用导航--这是我的代码，对我也适用;)

-- packages versions
@react-navigation/native: ^6.0.6
@react-navigation/native-stack: ^6.2.5
apisauce: ^2.1.1
react: 17.0.2
react-native: ^0.66.3

我有一个创建apisauce的主文件

// _api.js :

export const baseURL = 'APP_BASE_URL';
import { create } from 'apisauce'
import { setAPIInterceptors } from './interceptors';

const APIClient = create({ baseURL: baseURL })
setAPIInterceptors(APIClient)

我正在关注的是文件interceptors.js，并对它们进行管理：

// interceptors.js

import { logout } from "../redux/actions";
import { store } from '../redux/store';
import AsyncStorage from '@react-native-async-storage/async-storage';
    
export const setAPIInterceptors = (APIClient) => {  
        APIClient.addMonitor(monitor => {
            // ...
            // error Unauthorized
            if(monitor.status === 401) {
                store.dispatch(logout())
                AsyncStorage.clear().then((res) => {
                    RootNavigation.navigate('login');
                })
            }
    
        })
    }

然后我创建另一个文件并命名为“RootNavigation.js”，并从react本机导航创建一个ref：

// RootNavigation.js

import { createNavigationContainerRef } from '@react-navigation/native';

export const navigationRef = createNavigationContainerRef()

export function navigate(name, params) {
  if (navigationRef.isReady()) {
    navigationRef.replace(name, params);
  }
}
// add other navigation functions that you need and export them

然后，您应该在App.js文件中设置一些更改：

import { NavigationContainer } from '@react-navigation/native';
import { navigationRef } from './RootNavigation';

export default function App() {
  return (
    <NavigationContainer ref={navigationRef}>{/* ... */}</NavigationContainer>
  );
}

最后，在任何地方，您都可以调用此函数以使用react本机导航。

全聚焦器在这里解释如何在没有导航支柱的情况下导航。

Navigating without the navigation prop