Flutter 应用程序在 iOS 平台上的 Firebase 手机身份验证上崩溃

Posted

技术标签:

【中文标题】Flutter 应用程序在 iOS 平台上的 Firebase 手机身份验证上崩溃【英文标题】:Flutter app crashes on firebase phone auth in iOS platform 【发布时间】:2020-06-08 00:36:42 【问题描述】:

我已经在我的项目中实现了 Firebase Phone 身份验证,

android 端一切正常,但在 ios 端,当我尝试从我端发送验证码时,应用程序崩溃并失去连接。

我已经在下面提交了我的代码。

ma​​in.dart

class MyApp extends StatelessWidget 
  @override
  Widget build(BuildContext context) 
    return new MaterialApp(
        home: new MyHomePage(),
        routes: <String, WidgetBuilder> 
          '/homepage': (BuildContext context) => MyApp(),
          '/landingpage': (BuildContext context) => MyHomePage()
        
    );
  


class MyHomePage extends StatefulWidget 
  @override
  _MyHomePageState createState() => new _MyHomePageState();


class _MyHomePageState extends State<MyHomePage> 
  String phoneNo;
  String smsCode;
  String verificationId;

  Future<void> verifyPhone() async 
    print("main");
    final PhoneCodeAutoRetrievalTimeout autoRetrieve = (String verId) 
      print("varification id");
      this.verificationId = verId;
    ;

    final PhoneCodeSent smsCodeSent = (String verId, [int forceCodeResend]) 
      print("send code dilog");
      this.verificationId = verId;
      smsCodeDialog(context).then((value) 
        print('Signed in');
      );
    ;

    final PhoneVerificationCompleted verifiedSuccess = (AuthCredential user)
      print('Phone Verification Completed');
    ;

    final PhoneVerificationFailed veriFailed = (AuthException exception) 
      print('$exception.message');
    ;

    await FirebaseAuth.instance.verifyPhoneNumber(

        phoneNumber: "+919700000000",
        codeAutoRetrievalTimeout: autoRetrieve,
        codeSent: smsCodeSent,
        timeout: const Duration(seconds: 5),
        verificationCompleted: verifiedSuccess,
        verificationFailed: veriFailed);
  

  Future<bool> smsCodeDialog(BuildContext context) 
    return showDialog(
        context: context,
        barrierDismissible: false,
        builder: (BuildContext context) 
          return new AlertDialog(
            title: Text('Enter sms Code'),
            content: TextField(
              onChanged: (value) 
                this.smsCode = value;
              ,
            ),
            contentPadding: EdgeInsets.all(10.0),
            actions: <Widget>[
              new FlatButton(
                child: Text('Done'),
                onPressed: () 
                  FirebaseAuth.instance.currentUser().then((user) 
                    if (user != null) 
                      Navigator.of(context).pop();
                      Navigator.of(context).pushReplacementNamed('/homepage');
                     else 
                      Navigator.of(context).pop();
                      signIn();
                    
                  );
                ,
              )
            ],
          );
        );
  

  signIn()
    final AuthCredential credential = PhoneAuthProvider.getCredential(
        verificationId: verificationId,
        smsCode: smsCode);

    FirebaseAuth.instance.signInWithCredential(credential).then((user)
      Navigator.of(context).pushReplacementNamed('/homepage');
    ).catchError((e)
      print('Auth Credential Error : $e');
    );
  

  @override
  Widget build(BuildContext context) 
    return new Scaffold(
      appBar: new AppBar(
        title: new Text('PhoneAuth'),
      ),
      body: new Center(
        child: Container(
            padding: EdgeInsets.all(25.0),
            child: Column(
              mainAxisAlignment: MainAxisAlignment.center,
              children: <Widget>[
                TextField(
                  decoration: InputDecoration(hintText: 'Enter Phone number'),
                  onChanged: (value) 
                    this.phoneNo = value;
                  ,
                ),
                SizedBox(height: 10.0),
                RaisedButton(
                    onPressed: verifyPhone,
                    child: Text('Verify'),
                    textColor: Colors.white,
                    elevation: 7.0,
                    color: Colors.blue)
              ],
            )),
      ),
    );
  

提交按钮时出错

Launching lib/main.dart on Dhruvin’s iPhone in debug mode...
Automatically signing iOS for device deployment using specified development team in Xcode project: ******
Running Xcode build...
Xcode build done.                                           99.4s
Installing and launching...
Syncing files to device Dhruvin’s iPhone...
Lost connection to device.

但是,我无法看到堆栈跟踪或日志,因为应用程序失去了来自调试器的连接。

【问题讨论】:

如果应用中似乎存在一些iOS配置问题,请参考iOS设置部分并按照所有步骤操作(您还需要添加反向客户端ID,请检查是否已实现)跨度> 【参考方案1】:

我解决了问题, 非常感谢@DevarshRanpura 帮助我,

1) 替换

signIn()
    final AuthCredential credential = PhoneAuthProvider.getCredential(
        verificationId: verificationId,
        smsCode: smsCode);

    FirebaseAuth.instance.signInWithCredential(credential).then((user)
      Navigator.of(context).pushReplacementNamed('/homepage');
    ).catchError((e)
      print('Auth Credential Error : $e');
    );
  

到这里

signIn() async 
    final AuthCredential credential = PhoneAuthProvider.getCredential(
      verificationId: verificationId,
      smsCode: smsCode,
    );
    final AuthResult authResult = await _auth.signInWithCredential(credential);
    final FirebaseUser user = authResult.user;
    print('User Id : ' + user.uid);
  

还在你的 dart 文件中定义 _auth

final FirebaseAuth _auth = FirebaseAuth.instance;

2) 在您的项目中添加反向客户端 ID

在 xcode 中打开您的项目 双击您的项目名称 转到信息标签 在 URL Types->URL scheme 添加反向客户端 ID

【讨论】:

“在 URL 类型->URL 方案中添加反向客户端 ID”-> 你能解释一下吗? 这里有一个很好的解释:***.com/questions/61514076/… 感谢@ValentinSeehausen 更直观地解释问题,现在更多的开发者可以轻松解决这个问题。

以上是关于Flutter 应用程序在 iOS 平台上的 Firebase 手机身份验证上崩溃的主要内容,如果未能解决你的问题,请参考以下文章

Flutter是什么

Flutter包大小治理上的探索与实践

如何在不同平台上搭建Flutter开发环境

Flutter 驱动程序与原生元素交互

如何在 Flutter 中为 Web 编写特定于平台的代码?

flutter —— 谷歌打造的移动开发平台