Firebase Authentication on Ionic+Android opens a browser window

Question

I’m trying to authenticate a user using Firebase Auth. When using ionic serve --ssl everything works as you would expect.

However, when using ionic cordova run android -l --ssl and attempting to login the phone switches to the browser and opens a new tab. Selecting the account you would like to use (Google Auth) closes the tab. And that’s where it ends. Closing the browser and switching back to the app reveals the login page without any authentication occurring.

Here’s a video of it in action. IMGUR

I’ve tried the following guides:

1. https://firebase.google.com/docs/auth/web/google-signin
2. https://firebase.google.com/docs/auth/web/cordova

And the following libs:

1. https://github.com/RaphaelJenni/FirebaseUI-Angular
2. https://github.com/chemerisuk/cordova-plugin-firebase-authentication
3. https://github.com/baumblatt/capacitor-firebase-auth
4. https://ionicframework.com/docs/native/firebase-authentication (what kind of documentation is this!?) Any help I can get at this point would be greatly appreciated!

Answer 1

I ran into the similar issue using Quasar + Cordova. Solved it by commenting out the authDomain key from Firebase config used in firebase.initializeApp(config) method.

Answer 2

for anybody else struggling with this issue, please refer to https://github.com/baumblatt/capacitor-firebase-auth

the issue is the web version of firebaseUI does not work on native android, so you need this lib for it to work.

Replace whatever you had for login button

to this, you wrap Capacitor firebase auth's sign In function

  const handleSignIn = () => {
    cfaSignIn("google.com").subscribe((user: User) =>
      console.log(user.displayName)
    );
  };

in a function and call it with your sign-in button, then it should fix your problem.

you still however need to configure your SHA1 key on firebase for it to work on android.

good luck!