Flutter Web Firebase 身份验证问题

Posted 2023-02-23

技术标签:

【中文标题】Flutter Web Firebase 身份验证问题【英文标题】：Flutter web firebase authentication issue 【发布时间】：2020-11-27 23:56:06 【问题描述】：

我在 Flutter Web 中遇到了 Firebase 身份验证问题，下面我正在粘贴 Web 的索引文件代码...

<body>
<script src="https://www.gstatic.com/firebasejs/7.17.1/firebase-app.js"></script>
<script src="https://www.gstatic.com/firebasejs/7.17.1/firebase-auth.js"></script>
<script src="https://www.gstatic.com/firebasejs/7.17.1/firebase-analytics.js"></script>


<script>
  // Your web app's Firebase configuration
  var firebaseConfig = 
    apiKey: "xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx",
    authDomain: "xxxxxxxxxxxxx.firebaseapp.com",
    databaseURL: "https://xxxxxxxxxxx.firebaseio.com",
    projectId: "xxxxxxxxxxxxx",
    storageBucket: "xxxxxxxxxxxxx.appspot.com",
    messagingSenderId: "xxxxxxxxxx",
    appId: "1:xxxxxxxxx:web:xxxxxxxxxxxxx",
    measurementId: "G-xxxxxxxxx"
  ;
  // Initialize Firebase
  firebase.initializeApp(firebaseConfig);
  firebase.analytics();
</script>

<script src="main.dart.js" type="application/javascript"></script>
</body>

在我的 pubspec.yaml 文件中，我有 firebase 依赖项

  firebase_core: ^0.4.0+9
  firebase_analytics: ^5.0.2
  firebase_auth: ^0.14.0+5
  cloud_firestore: ^0.12.9+5
  firebase_storage: ^3.1.6
  firebase_messaging: ^6.0.16
  firebase: ^7.3.0

整个身份验证代码在移动 android/ios 中有效，但在网络中无效，我看不到任何日志第二次单击登录按钮时出现的唯一日志，第一次没有任何反应 -_- 这是主要问题，任何一个请帮我解决我的问题，谢谢。

频道溢出：plugins.flutter.io/firebase_auth。此通道上的消息以 FIFO 方式被丢弃。引擎可能没有运行，或者您需要调整通道的缓冲区大小。

MissingPluginException（在通道 plugins.flutter.io/firebase_auth 上找不到方法 signInWithCredential 的实现）

我的登录代码

    AuthResult authResult = await EmailPassAuthentication.loginWithEmail(
      // invoked on error
      () 
        if (kIsWeb) 
          showDialog(
            context: context,
            builder: (BuildContext ctx) 
              return AlertDialog(
                title: Text('Invalid Login Details'),
                content: Text('Incorrect email or password !'),
              );
            ,
          );
         else 
          showSnackBar('Incorrect email or password !', false);
        
      ,
      email: user.email,
      password: user.password,
    );
    if (authResult != null && authResult.user != null) 
      // user logged in success.
      user = await FirestoreHelper.getUserFromData(authResult.user);
//      showSnackBar('Successfuly Logged in', true);
      _navigate();

以及我处理登录的静态 loginWithEmail 方法

FirebaseAuth auth = FirebaseAuth.instance;
    AuthResult authResult = await auth.signInWithEmailAndPassword(email: email, password: password).catchError(
      (error) 
        onErrorCallback.call();
      ,
    );
    return authResult;

【问题讨论】：

【参考方案1】：

您使用的是旧版本的 firebase，最好的办法是更新所有依赖项。因此打开终端并执行：