Flutter Firebase Auth登出后重新登录跳转失效问题求助

问题现象 #

• 应用首次启动时，登录可正常跳转至HomePage
• 登出后重新登录，停留在LoginPage无法跳转至HomePage
• 热重启后跳转恢复正常，但仅生效一次，后续登录仍卡住

相关代码 #

main.dart 核心配置 #

home: const AuthPage(),

auth.dart 代码 #

import 'package:firebase_auth/firebase_auth.dart';
import 'package:flutter/material.dart';
import 'package:mini_social_app/auth/login_or_register.dart';
import 'package:mini_social_app/pages/home_page.dart';
class AuthPage extends StatelessWidget {
  const AuthPage({super.key});
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      body: StreamBuilder(
        stream: FirebaseAuth.instance.authStateChanges(),
        builder: (context, snapshot) {
          // 用户已登录
          if (snapshot.hasData) {
            return const HomePage();
          }
          // 用户已登出
          else {
            return const LoginOrRegister();
          }
        },
      ),
    );
  }
}

login.dart 登录方法 #

void login(BuildContext context) async {
  // 显示加载圈
  showDialog(
    context: context,
    builder: (context) => const Center(
      child: CircularProgressIndicator(),
    ),
  );

  // 尝试登录
  try {
    await FirebaseAuth.instance.signInWithEmailAndPassword(
      email: mailController.text,
      password: passwordController.text,
    );

    // 关闭加载圈
    if (context.mounted) Navigator.of(context).pop();
    print('login : sign-in');
  } on FirebaseException catch (e) {
    // 关闭加载圈
    Navigator.of(context).pop();
    displayErrorMessageToUser(e.code, context);
  }
}

问题原因 #

1. 登录成功后仅关闭加载弹窗，LoginPage仍留在页面栈中，AuthPage的StreamBuilder未触发重建
2. 热重启后应用重新初始化，StreamBuilder能正确监听auth状态，暂时恢复，但页面栈问题未解决，导致再次登录失效

解决方案 #

方案1：优化登录后的页面导航 #

登录成功后直接替换页面栈，移除LoginPage：
修改login.dart中的登录方法：

void login(BuildContext context) async {
  showDialog(
    context: context,
    builder: (context) => const Center(child: CircularProgressIndicator()),
  );

  try {
    await FirebaseAuth.instance.signInWithEmailAndPassword(
      email: mailController.text,
      password: passwordController.text,
    );

    if (context.mounted) {
      Navigator.of(context).pop(); // 关闭加载弹窗
      // 替换页面栈，直接跳转HomePage
      Navigator.of(context).pushReplacement(
        MaterialPageRoute(builder: (context) => const HomePage()),
      );
    }
    print('login : sign-in');
  } on FirebaseException catch (e) {
    Navigator.of(context).pop();
    displayErrorMessageToUser(e.code, context);
  }
}

方案2：确保StreamBuilder正常监听状态 #

将AuthPage改为StatefulWidget，确保auth状态变化能触发UI重建：

class AuthPage extends StatefulWidget {
  const AuthPage({super.key});

  @override
  State<AuthPage> createState() => _AuthPageState();
}

class _AuthPageState extends State<AuthPage> {
  late Stream<User?> _authStream;

  @override
  void initState() {
    super.initState();
    _authStream = FirebaseAuth.instance.authStateChanges();
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      body: StreamBuilder<User?>(
        stream: _authStream,
        builder: (context, snapshot) {
          if (snapshot.connectionState == ConnectionState.active) {
            return snapshot.hasData 
                ? const HomePage() 
                : const LoginOrRegister();
          }
          // 加载状态
          return const Center(child: CircularProgressIndicator());
        },
      ),
    );
  }
}

方案3：规范登出操作 #

登出仅调用signOut()，不手动跳转，交给StreamBuilder自动处理：

void signOut() async {
  await FirebaseAuth.instance.signOut();
}

验证建议 #

1. 登录成功后打印页面栈长度，确认LoginPage已被移除
2. 在StreamBuilder中添加日志，查看auth状态更新是否被捕获
3. 检查登出操作是否仅触发signOut()，无额外跳转逻辑

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