Google SignIn SDK is failing by throwing error, A non-recoverable sign in failure occurred -catch error: React Native

Issue

I have been trying to integrate Social login in my react native project in which I was able to do facebook login successfully but it is failing to signin to google. react-native-google-signin library is used for google.

The code I have used.

componentDidMount() {
GoogleSignin.hasPlayServices({ autoResolve: true }).then(() => {
// play services are available. can now configure library
}).catch((err) => {

console.log("Play services error", err.code, err.message);
})
GoogleSignin.configure({
scopes: ["https://www.googleapis.com/auth/drive.readonly"], // what API you want to access on behalf of the user, default is email and profile
// iosClientId: <FROM DEVELOPER CONSOLE>, // only for iOS
webClientId: "xxx", // client ID of type WEB for your server (needed to verify user ID and offline access)
// offlineAccess: true // if you want to access Google API on behalf of the user FROM YOUR SERVER
//hostedDomain: '' // specifies a hosted domain restriction
//forceConsentPrompt: true // [Android] if you want to show the authorization prompt at each login
//accountName: '' // [Android] specifies an account name on the device that should be used
})
.then(() => {
// you can now call currentUserAsync()
});
    _signIn = async () => {

        try {

            await GoogleSignin.hasPlayServices(

              )

          const userInfo = await GoogleSignin.signIn();
          console.log('User Info --> ', userInfo);
          this.setState({ userInfo });
        } catch (error) {

          console.log('Message', error.message);
          if (error.code ===  statusCodes.SIGN_IN_CANCELLED) {
            console.log('User Cancelled the Login Flow');
          } else if (error.code === statusCodes.IN_PROGRESS) {
            console.log('Signing In');
          } else if (error.code === statusCodes.PLAY_SERVICES_NOT_AVAILABLE) {
            console.log('Play Services Not Available or Outdated');
          } else {
            console.log('Some Other Error Happened');
          }
        }
      };

The error response:

Message: A non-recoverable sign in failure occurred -catch error

Solution

That's due to the clientId. In google developer console, When you configure the project for webClientID, instead of creating a new project choose an existing one, i.e create the project first and then choose it for creating credentials.

Create a new project first as of in below picture

then choose that project from the list to create credentials

It worked for me.

And coming to sign in configuration

GoogleSignin.hasPlayServices({ autoResolve: true }).then(() => {

})
.catch((err) => {
      console.log("Play services error", err.code, err.message);
})

GoogleSignin.configure({
     scopes: ["https://www.googleapis.com/auth/userinfo.profile"],//scopes as you need 
     webClientId: "***(Your clientId)",
     //iosClientId: <FROM DEVELOPER CONSOLE>, // only for iOS 
     //offlineAccess: true, //(give it true if you need serverAuthCode i.e cross client authorisation)
     //hostedDomain: '' 
     //forceConsentPrompt: true // [Android] if you want to show the authorization prompt at each login
     //accountName: ''
})

Answered By - Chaithanya Krishna