android - Firebase Phone OTP Auth in FLutter

Question

Iam building a Flutter App that involves Phone OTP authentication using Firebase and it gives the following error. I am struck here and have no idea how to debug.

2021-01-29 14:07:36.021 32521-32521/com.example.flutter_test1 E/AndroidRuntime: FATAL EXCEPTION: main
Process: com.example.flutter_test1, PID: 32521
java.lang.NoClassDefFoundError: Failed resolution of: Landroidx/browser/customtabs/CustomTabsIntent$Builder;
    at com.google.firebase.auth.internal.RecaptchaActivity.zza(com.google.firebase:firebase-auth@@20.0.1:13)
    at com.google.android.gms.internal.firebase-auth-api.zzth.zzb(com.google.firebase:firebase-auth@@20.0.1:7)
    at com.google.android.gms.internal.firebase-auth-api.zzth.onPostExecute(Unknown Source:2)
    at android.os.AsyncTask.finish(AsyncTask.java:755)
    at android.os.AsyncTask.access$900(AsyncTask.java:192)
    at android.os.AsyncTask$InternalHandler.handleMessage(AsyncTask.java:772)
    at android.os.Handler.dispatchMessage(Handler.java:107)
    at android.os.Looper.loop(Looper.java:214)
    at android.app.ActivityThread.main(ActivityThread.java:7397)
    at java.lang.reflect.Method.invoke(Native Method)
    at com.android.internal.os.RuntimeInit$MethodAndArgsCaller.run(RuntimeInit.java:492)
    at com.android.internal.os.ZygoteInit.main(ZygoteInit.java:935)
 Caused by: java.lang.ClassNotFoundException: Didn't find class "androidx.browser.customtabs.CustomTabsIntent$Builder" on path: DexPathList[[zip file "/data/app/com.example.flutter_test1-VMY7lKsstWxY71zd6Q5xmA==/base.apk"],nativeLibraryDirectories=[/data/app/com.example.flutter_test1-VMY7lKsstWxY71zd6Q5xmA==/lib/arm64, /data/app/com.example.flutter_test1-VMY7lKsstWxY71zd6Q5xmA==/base.apk!/lib/arm64-v8a, /system/lib64, /product/lib64]]
    at dalvik.system.BaseDexClassLoader.findClass(BaseDexClassLoader.java:196)
    at java.lang.ClassLoader.loadClass(ClassLoader.java:379)
    at java.lang.ClassLoader.loadClass(ClassLoader.java:312)
    at com.google.firebase.auth.internal.RecaptchaActivity.zza(com.google.firebase:firebase-auth@@20.0.1:13)?
    at com.google.android.gms.internal.firebase-auth-api.zzth.zzb(com.google.firebase:firebase-auth@@20.0.1:7)?
    at com.google.android.gms.internal.firebase-auth-api.zzth.onPostExecute(Unknown Source:2)?
    at android.os.AsyncTask.finish(AsyncTask.java:755)?
    at android.os.AsyncTask.access$900(AsyncTask.java:192)?
    at android.os.AsyncTask$InternalHandler.handleMessage(AsyncTask.java:772)?
    at android.os.Handler.dispatchMessage(Handler.java:107)?
    at android.os.Looper.loop(Looper.java:214)?
    at android.app.ActivityThread.main(ActivityThread.java:7397)?
    at java.lang.reflect.Method.invoke(Native Method)?
    at com.android.internal.os.RuntimeInit$MethodAndArgsCaller.run(RuntimeInit.java:492)?
    at com.android.internal.os.ZygoteInit.main(ZygoteInit.java:935)?

This is my Function for sending OTP:

Future verifyPhoneNumber(BuildContext context) async{
FirebaseAuth auth = FirebaseAuth.instance;

final PhoneVerificationCompleted verificationCompleted = (PhoneAuthCredential phoneAuthCredential) 
async {
await auth.signInWithCredential(phoneAuthCredential);
};

PhoneVerificationFailed verificationFailed =
  (FirebaseAuthException authException){
print("FAILED AUTH $authException");
};

//When code is Sent
PhoneCodeSent codeSent =
  (String verificationId, [int forceSendingToken]) async {
    String smsCode = '';
    PhoneAuthCredential phoneAuthCredential = PhoneAuthProvider.credential(verificationId: 
   verificationId, smsCode: smsCode);
    await auth.signInWithCredential(phoneAuthCredential);
 };

 PhoneCodeAutoRetrievalTimeout codeAutoRetrievalTimeout =
  (String verificationId) {
_verificationId = verificationId;
 };

try {
  await auth.verifyPhoneNumber(
  phoneNumber: _mobileNumberController.text,
  timeout: const Duration(seconds: 10),
  verificationCompleted: verificationCompleted,
  verificationFailed: verificationFailed,
 codeSent: codeSent,
  codeAutoRetrievalTimeout: codeAutoRetrievalTimeout,
 );
}catch(e){
 print("error is : $e");
 }

Iam calling this verifyPhoneNumber() on click of a button, after entering the mobile number.

question from:https://stackoverflow.com/questions/65951318/firebase-phone-otp-auth-in-flutter

Answer 1

Since you are still debugging, you will need to also implement reCaptcha support, since Androids safetynet will fail when using debug sha fingerprints.

Inside your project -> android -> app -> build.gradle , add the following line to the dependencies at the bottom:

implementation "androidx.browser:browser:1.2.0"

So your build.gradle file should look something like this:

https://gitlab.com/codebasetutorials/flutter-phone-authentication/-/blob/7f29304527ffc8756321fcccfac7a3b4a2cbdba9/android/app/build.gradle

Also make sure that your minSdk is at least 21

I made a video tutorial about everything you need here: https://youtu.be/dTmgjPkBN58