Flutter Firebase Phone Authentication

0


image source https://www.youtube.com/watch?v=uaerc_uy-ME&ab_channel=SantosEnoque

Flutter supports varius ways to log in to firebase authentication.
One of them is the phone verification, which google sends OTP to the user's phone number.

This sign in function requires PhoneAuthCredential

FirebaseAuth _auth = FirebaseAuth.instance;

  String verificationId = '';
  bool showLoading = false;

  void signInWithPhoneAuthCredential(
      PhoneAuthCredential phoneAuthCredential) async {
    setState(() {
      showLoading = true;
    });

    try {
      final authCredential =
          await _auth.signInWithCredential(phoneAuthCredential);
      setState(() {
        showLoading = false;
      });
      if (authCredential.user != null) {
        Navigator.pushReplacement(
            context, MaterialPageRoute(builder: (context) => LandingRoute()));
      }
    } on Exception catch (e) {
      setState(() {
        showLoading = false;
        print('err from signInWithPhoneAUthCredential function call back');
        currentState = MobileVerificationState.SHOW_MOBILE_FORM_STATE;
      });
      print(e);
    }
  }

PhoneAuthCredential is created via

await _auth.verifyPhoneNumber(
                    phoneNumber: processedPhoneNumber,
                    verificationCompleted: (phoneAuthCredential) async {
                      setState(() {
                        print('verificationCompleted');
                        showLoading = false;
                      });
                      signInWithPhoneAuthCredential(
                          phoneAuthCredential); //not needed yet
                    },
                    verificationFailed: (verificationFailed) async {
                      setState(() {
                        print('verificationFailed');
                        showLoading = false;
                      });

                      print(verificationFailed.message);
                      setState(() {
                        showLoading = false;
                        currentState =
                            MobileVerificationState.SHOW_MOBILE_FORM_STATE;
                      });
                      print('error from verificationFailed');
                    },
                    codeSent: (verificationId, resendingToken) async {
                      print('codeSent');
                      setState(() {
                        showLoading = false;
                        currentState =
                            MobileVerificationState.SHOW_OPT_FORM_STATE;
                        this.verificationId = verificationId;
                      });
                    },
                    codeAutoRetrievalTimeout: (verificationId) async {},
                  );
                }

플러터와 파이어베이스로 핸드폰 로그인을 할 수 있다.
주의해야 할 점은 Admin SDK를 사용하지 않으면 회원가입이 되어있는지 미리 체크 할 방법이 없다는것이다.
이메일로 로그인 할 경우 그 방법이 이미 auth.안에 내장 되어있지만 phoneAuth의 경우는 그렇지 않다.

이걸 하기 위해서 firestore에 유저정보를 입력후 로그인시 서버를 불러오려고 했으나 보안 규칙상 auth변수 없이 서버에 접근 하는것은 옳지 않다.

파이어베이스 cloud function을 통해서 별도의 백엔드 서버없이 할 수 있는것 같은데 더 공부해봐야겠다.

0개의 댓글