firebase.auth.GoogleAuthProvider.credential is undefined

Viewed 477

Authenticate Using Google Sign-In

I'm using Firebase to Sign in a user using Advanced: Handle the sign-in flow manually. I have set up Firebase like so:

firebaseConfig.js

// Config file
import * as firebase from "firebase";

const config = {
      apiKey: "api-key",
      authDomain: "project-id.firebaseapp.com",
      databaseURL: "https://project-id.firebaseio.com",
      projectId: "project-id",
      storageBucket: "project-id.appspot.com",
      messagingSenderId: "sender-id",
      appId: "app-id",
      measurementId: "G-measurement-id",

};

export default !firebase.apps.length ? firebase.initializeApp(config) : firebase.app();

I then import firebase in another file to authenticate and sign in a user.

LoginUser.js

_isUserEqual = (googleUser, firebaseUser) => {
        if (firebaseUser) {
          var providerData = firebaseUser.providerData;
          for (var i = 0; i < providerData.length; i++) {
            if (providerData[i].providerId === firebase.auth.GoogleAuthProvider.PROVIDER_ID &&
                providerData[i].uid === googleUser.getBasicProfile().getId()) {
              // We don't need to reauth the Firebase connection.
              return true;
            }
          }
        }
        return false;
      }

    _onSignIn = googleUser => {
        console.log('Google Auth Response', googleUser);
        // We need to register an Observer on Firebase Auth to make sure auth is initialized.
        var unsubscribe = firebase.auth().onAuthStateChanged(firebaseUser => {
          unsubscribe();
          // Check if we are already signed-in Firebase with the correct user.
          if (!this._isUserEqual(googleUser, firebaseUser)) {
            // Build Firebase credential with the Google ID token.
            var credential = firebase.auth.GoogleAuthProvider.credential(
                googleUser.idToken,
                googleUser.accessToken
            );
            // Sign in with credential from the Google user.
            firebase.auth().signInWithCredential(credential).catch(error => {
              // Handle Errors here.
              var errorCode = error.code;
              var errorMessage = error.message;
              // The email of the user's account used.
              var email = error.email;
              // The firebase.auth.AuthCredential type that was used.
              var credential = error.credential;
              // ...
            });
          } else {
            console.log('User already signed-in Firebase.'); 
          }
        });
      }

_signInWithGoogleAsync = async () => {
        try {
          const result = await Google.logInAsync({
            androidClientId: "AndroidClientId",
            scopes: ['profile', 'email'],
          });
      
          if (result.type === 'success') {
            this._onSignIn(result)
            return result.accessToken;
          } else {
            return { cancelled: true };
          }
        } catch (e) {
          return { error: true };
        }
      }

When I execute the authentication, I receive an error:

Possible unhandled Promise Rejection (id: 0): TypeError: undefined is not an object (evaluating '_firebaseConfig.default.GoogleAuthProvider.credential') showing that firebase.auth.GoogleAuthProvider is undefined.

Screenshot of the error

Are there any reasons as to why this could be the case? Thanks.

0 Answers
Related