使用auto_route如何实现登录成功后禁止回退到登录页面?
auto_route AuthGuard登录后禁止返回登录页解决方案
核心原因:现有实现的导航栈中保留了登录页路由,点击系统返回键会按栈顺序回退到登录页。以下是完整修改方案:
1. 调整AuthGuard重定向逻辑
修改未登录时的跳转逻辑,用路由替换替代栈叠加,同时根据登录状态适配重评估策略,避免未授权路由和登录页同时留存在栈中:
class AuthGuard extends AutoRedirectGuard { final AuthService authService; bool isLoggedIn; AuthGuard(this.authService, this.isLoggedIn) { authService.authChanges.listen((isLoggedIn) { if (this.isLoggedIn != isLoggedIn) { this.isLoggedIn = isLoggedIn; // 登录状态变更为已登录时用替换策略,移除栈顶的登录页 reevaluate( strategy: isLoggedIn ? const ReevaluationStrategy.replace() : const ReevaluationStrategy.rePushFirstGuardedRouteAndUp(), ); } }); } @override Future<void> onNavigation(NavigationResolver resolver, StackRouter router) async { if (await authService.isLoggedIn()) { resolver.next(); } else { // 跳转登录页时替换当前路由,不保留未授权的目标路由到栈中 router.replace(const LoginRoute()); resolver.next(false); } } }
2. 修改登录成功后的跳转逻辑
登录操作完成后跳转首页时,清空栈中所有非根路由,彻底移除登录页痕迹:
// 登录接口验证通过后执行该跳转逻辑 context.pushAndPopUntil( const HomeRoute(), // predicate返回true的路由会被保留,这里只保留根路由,移除中间所有页面包括登录页 predicate: (route) => route.isFirst, );
3. 新增登录页前置校验(可选,兼容性更强)
给登录路由添加进入前的鉴权校验,已登录用户主动访问登录页(包括点击返回、手动输入地址)时会被自动重定向到首页:
// 路由配置处添加登录页的onEnter回调 @MaterialAutoRouter( routes: [ AutoRoute( path: '/login', page: LoginPage, onEnter: _redirectIfLoggedIn, ), // 其余路由配置保持不变 ] ) Future<void> _redirectIfLoggedIn(BuildContext context, StackRouter router) async { final authService = context.read<AuthService>(); // 按你项目的依赖注入方式获取AuthService实例 if (await authService.isLoggedIn()) { router.replace(const HomeRoute()); } }
内容的提问来源于stack exchange,提问作者szelemeh
相关产品推荐
相关产品推荐

