Flutter AutoRoute如何重定向用户至原目标访问路径？

核心思路 #

未认证时捕获用户原本要访问的路由路径，登录成功后优先跳转该路径，无有效路径时 fallback 到 MarketplaceScreen；同时配置未知路由的默认跳转。

具体实现步骤 #

1. 保存待跳转的目标路由

简单场景可以用全局静态变量，复杂场景推荐用状态管理来存储用户未认证时的目标路径。

简单场景（全局变量）：

class AuthHelper {
  // 存储待跳转的路由名称
  static String? pendingRouteName;
}

推荐：状态管理（Riverpod 示例）：

// 定义状态提供者存储待跳转路由
final pendingRouteProvider = StateProvider<String?>((ref) => null);

2. 在路由守卫中捕获目标路径

修改你的 AuthGuard，在用户未认证时保存当前请求的路由：

class AuthGuard extends AutoRouteGuard {
  // 如果用Riverpod，需要传入Ref
  // final Ref ref;
  // AuthGuard(this.ref);

  @override
  void onNavigation(NavigationResolver resolver, StackRouter router) {
    // 替换成你的实际认证判断逻辑
    bool isAuthenticated = checkUserAuth();

    if (isAuthenticated) {
      // 已认证，允许访问目标路由
      resolver.next(true);
    } else {
      // 未认证，保存当前目标路由
      AuthHelper.pendingRouteName = resolver.route.name;
      // Riverpod版本：ref.read(pendingRouteProvider.notifier).state = resolver.route.name;

      // 跳转到登录页
      router.push(const SignInRoute());
    }
  }
}

3. 登录成功后跳转原目标路由

在登录按钮的回调中，判断是否有保存的目标路由，优先跳转，否则 fallback 到 MarketplaceScreen：

void handleLoginSuccess(BuildContext context) async {
  // 先完成登录逻辑（比如保存token、更新认证状态）
  await performLogin();

  // 获取待跳转路由
  final targetRoute = AuthHelper.pendingRouteName;
  // Riverpod版本：final targetRoute = ref.read(pendingRouteProvider);

  if (targetRoute != null) {
    // 跳转回用户原本要访问的路由
    context.router.pushNamed(targetRoute);
    // 清空存储的路由，避免重复跳转
    AuthHelper.pendingRouteName = null;
    // Riverpod版本：ref.read(pendingRouteProvider.notifier).state = null;
  } else {
    // 无目标路由，跳转到默认的MarketplaceScreen
    context.router.replace(const MarketplaceRoute());
  }
}

4. 配置未知路由的Fallback

在你的 AppRouter 配置中，添加未知路由的默认跳转，确保用户输入无效URL时跳转到 MarketplaceScreen：

@MaterialAutoRouter(
  replaceInRouteName: 'Page,Route',
  routes: [
    // 受保护路由（需认证）
    AutoRoute(
      path: '/',
      page: ProtectedRouter,
      guards: [AuthGuard],
      children: [
        AutoRoute(path: '', page: MarketplaceScreen),
        // 其他需要认证的子路由
      ],
    ),
    // 公开路由（无需认证）
    AutoRoute(
      path: '/auth',
      page: PublicWrapper,
      children: [
        AutoRoute(path: 'sign-in', page: SignInRoute),
        // 其他公开子路由
      ],
    ),
    // 未知路由fallback到MarketplaceScreen
    AutoRoute(path: '*', page: MarketplaceScreen),
  ],
)
class AppRouter extends _$AppRouter {}

关键注意点 #

• 确保所有需要认证的路由都被 AuthGuard 守卫，避免未认证直接访问。
• Web端路由策略建议使用 PathUrlStrategy（需在main函数中配置），确保URL解析正常：

  void main() {
    WidgetsFlutterBinding.ensureInitialized();
    if (kIsWeb) {
      setPathUrlStrategy();
    }
    runApp(const MyApp());
  }
  

• 复杂应用中优先使用状态管理（如Riverpod、Provider）存储待跳转路由，避免全局变量的状态污染问题。

内容的提问来源于stack exchange，提问作者TraaidMark