注销 React Native 应用程序的最佳实践？

Question

我目前已经在我的应用程序上实现了注销功能（使用 firebase 身份验证）：

const handleSignOut = () => {
  signOut(auth)
    .then(() => navigation.navigate("Login"))
    .catch((err) => console.error(err));
};

但是，我知道这还不够，因为我注意到一些状态在用户之间被保留（即使在注销后状态也被保留），我想知道 clear/reset 所有这些的最佳方法是什么状态是。

我是否需要手动卸载我的所有组件（我仍然不太明白 how/when 组件卸载发生了），或者有没有一种简单的方法可以使用导航或上下文工具来实现？

我正在使用上下文 API 和 React 导航：

const Stack = createStackNavigator();

const Navigation = () => {
  return (
    <NavigationContainer>
      <Stack.Navigator
        headerMode="none"
      >
        <Stack.Screen
          name="Register"
          component={RegisterScreen}
        />
        <Stack.Screen
          name="Login"
          component={LoginScreen}
        />
        <Stack.Screen
          name="Home"
          component={HomeScreen}
        />
      </Stack.Navigator>
    </NavigationContainer>
  );
};

Answer 1

这很难说，因为其中很多都是特定于应用程序的，但一般来说，您需要指定一个能够破坏用户会话的方法，并确保它是持久的。也许它正在注销 Firebase，也许它正在清除一些 cookie，也许它正在更新一些其他持久状态。

重点是，您编写了一个方法来负责执行所有数据操作以确保该会话不再存在。重要的是，它不与任何导航或其他相关联。只是单纯的数据操作

那么你就有了这个可重用的函数来注销用户，可以从任何地方调用。应用于您的示例...

// Notice that things that can possibly fail are wrapped in dedicated try/catches.
// You don't want the failure to clear some state prevent your ability to clear others.
const doSomeBigGlobalSessionLogout = async () => {
  const maybeErrors = [];
  try {
    await firebase.signOut(auth);
  } catch (e) {
    maybeErrors.push(e);
  }
  try {
    await clearSomeOtherPersistentState();
  } catch (e) {
    maybeErrors.push(e);
  }

  /* do something with errors */
  // for (error of maybeErrors) { ... }

  // Still resolve successfully, because you won't want to lock the user from
  // not being able to sign out.
  return Promise.resolve();
};

// Here you can trust it will never lock the user out, and will always clear state as best as it can.
doSomeBigGlobalSessionLogout()
   // You *will* get here.
  .then(() => navigation.navigate("Login"));

最后，就 UI 而言，首先移动用户可能是有意义的。否则用户会看到他们的状态在他们眼前从屏幕上消失！

Promise.resolve()
  .then(() => navigation.navigate("SomePlaceThatsPretty"));
  .then(doSomeBigGlobalSessionLogout)
  .then(() => navigation.navigate("Login"));

注销 React Native 应用程序的最佳实践？

Best practice for logging out of React Native app?

react-native

react-navigation

react-context