MR_AMDEV
MR_AMDEV

Reputation: 1922

Show Exception Errors in UI Firebase Auth Flutter

First of all i am new to Flutter, i read lots of threads but not getting anything.

WHAT IS MY PROBLEM?

i have two pages auth.dart and login.dart.In auth.dart page i have a class called AuthService which consists of the following code(to the point):

class AuthService {

  final FirebaseAuth _auth = FirebaseAuth.instance;

  Future<bool> signInWithPhone(String phone, BuildContext context) async {
  ....
      verificationFailed: (AuthException exception) {
        // i can see the exception in debug console using print
        return exception;
      },
  ....
  }

}

In login.dart, i have a statefull widget which which looks like this and in there i referenced the above class and i am calling the signInWithPhone method:

class LoginScreen extends StatefulWidget {
  @override
  _LoginScreenState createState() => _LoginScreenState();
}

class _LoginScreenState extends State<LoginScreen> {

  final AuthService _auth = AuthService();
  ....
  ....
  Container(
    width: double.infinity,
    child: FlatButton(
        child: Text("LOGIN"),
        textColor: Colors.white,
        padding: EdgeInsets.all(16),
        onPressed: () {
            // here i am calling the method signInWithPhone of above class

            final phone = _phoneController.text.trim();
            _auth.signInWithPhone(phone, context);

        }
    )
  )
 ....
 ....
}

WHAT I WANT?

I want to display the exception error message received in onPressed event of my Login button so that i can display a alert dialogue using the error message.

WHAT I HAVE TRIED ?

1) print(_auth.signInWithPhone(phone, context)); But it returns null;

2)

_auth.signInWithPhone(phone, context).then((value){
   // alert/text/print
   print(value);
   }

this also returns null

Can anybody please help me solve it as i need to show user the error message if the mobile number is not correct or the OTP is not corrrect.

Upvotes: 0

Views: 619

Answers (1)

Ahmed Khattab
Ahmed Khattab

Reputation: 2799

well, first of all you need to listen to the exception and await it , you can return false in case of an expection and do something depending on that case like so.

you can return a map that contains the result and a message like so

{
  'message': message,
  'success' : true or false depending on the state of the request
}

so

in AuthService.dart

 verificationFailed: (AuthException exception) {
        // i can see the exception in debug console using print
        //return exception;
        return {
            'message': exception,
           'success': false
         }; // means verification failed;
 },


in LoginScreen.dart


void showAlert(message) {
    showDialog(context: context, builder: (context) {
       return AlertDialog(
         title: message,
       );
    });
}

 onPressed: async () {
            // here i am calling the method signInWithPhone of above class

            final phone = _phoneController.text.trim();
            final result = await _auth.signInWithPhone(phone, context);


            if(!result['suceess']) {
                 this.showAlert(result['message']);
             }
        }

Upvotes: 1

Related Questions