如何在使用 Firebase 身份验证在 flutter 应用程序中注销时修复循环等待进度？

Question

我有一个用于登录的 LoginPage() 和一个成功登录后出现的 DashBoard() 页面。 我正在使用 Controller() 页面来提供身份验证，它监听 firebase 中的任何身份验证更改，它看起来像这样：

class Controller extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return Scaffold(
        body: StreamBuilder(
      stream: FirebaseAuth.instance.authStateChanges(),
      builder: (context, snapshot) {
        if (snapshot.connectionState == ConnectionState.waiting) {
          return Center(child: CircularProgressIndicator());
        }
        else if (snapshot.hasData) {
          return DashBoard();
        }
        return LoginPage();
      },
    ));
  }
}

我在另一个页面中也有一个注销按钮。 当我尝试注销时，它首先将我扔到 DashBoard() 页面（这意味着 snapshot.hasData 有一些价值），然后在 2-3 秒后将我扔到 LoginPage() 但代码永远不会进入本节

if (snapshot.connectionState == ConnectionState.waiting) {
     return Center(child: CircularProgressIndicator());
}

它首先进入这个块条件

else if (snapshot.hasData) {
     return DashBoard();
}

然后是 LoginPage() 部分。 此外，当我尝试登录时，它从不向我显示 Circularwait，而是将我扔到 DashBoard() 页面。 实现这一目标的最佳方法是什么？ 我的 fireBase 身份验证文件如下所示：

class GoogleSignInProvider extends ChangeNotifier {
  final googleSignIn = GoogleSignIn();
  GoogleSignInAccount _user;

  GoogleSignInAccount get user => _user;

  Future signInWithGoogle() async {
    try {
      final GoogleSignInAccount googleuser = await googleSignIn.signIn();
      if (googleuser == null) return;
      _user = googleuser;

      final GoogleSignInAuthentication googleAuth =
          await googleuser.authentication;

      final GoogleAuthCredential credential = GoogleAuthProvider.credential(
          idToken: googleAuth.idToken, accessToken: googleAuth.accessToken);
      // Fluttertoast.showToast(msg: "Account created");

      await FirebaseAuth.instance.signInWithCredential(credential);
      print(_user);
      notifyListeners();
    } catch (e) {
      print(e.toString());
    }
  }

  Future signOutGoogle() async {
    await googleSignIn.disconnect();
    FirebaseAuth.instance.signOut();
  }
}

Answer 1

在你的 ui 中使用 streambuilder 与 bloc 进行交互。 ui 创建 bloc 代码处理的事件并使用 state output 响应

abstract class LoginEvent extends Equatable{
  const LoginEvent();
  @override 
  List<Object>get props=>[];
}

class LoginUser{
  final String email;
  final String password;
  const LoginUser(this.email,this.password);
  String get getEmail { return this.email;}
  String get getPassword{ return this.password;}
}
class AuthenticateEvent extends LoginEvent{
  final LoginUser user;
  const AuthenticateEvent(this.user);
  @override 
  List<Object> get props => [user];
  LoginUser get getUser{return this.user;}
}


class LoginState extends Equatable{
 final LoginView _login;
 const LoginState(this._login);
 @override 
 List<Object> get props => [_login];
 LoginView get getLogin {return this._login;}
}

class BlocLogin
{
  Stream<LoginState> get loginStream => _loginController.stream;
  final _loginController = BehaviorSubject<LoginState>();

  void dispose()
  {
    _loginController.close();
  }
  authenticate(BuildContext context,LoginEvent loginEvent) async
  {

    if (loginEvent is AuthenticateEvent)
    {
        LoginView param =
          new LoginView(loginEvent.getUser.getEmail, loginEvent.getUser.getPassword);
          
          LoginView loginValue =await Provider.of<Api>(context, listen: false)
          .addLogin(context, param);

            if (loginValue.returnMessage == "Failed") {
              DialogCaller.showIncorrectLoginDialog(context).then((value2) {});
            } else {
                Provider.of<Api>(context, listen: false).dataCache.login = loginValue;
                LoginState loginState=new LoginState(loginValue);
                _loginController.sink.add(loginState);
            }
    }

  }


}