CODEWITHSUNDEEP
angularfirebaseionic2google-plusfirebase-authentication
Richard
Richard

Reputation: 8955

Google/Firebase Authentication no displayName or photoURL for iOS

I am using Ionic2 and GooglePlus Authentication.

I can sign in and it creates a User with a uid in the Firebase Authentication list as expected.

When I do this:

        GooglePlus.login({
            'webClientId': webClientId,
            'offline': true
        }).then(googleData => {

Where the webClientId matches the Client ID in the iOS Credential below.

Problem:

However, for iOS, the googleData does contain an emailAddress and uid, but the displayName and photoURL are null.

More Info:

I do have an iOS Credential set up with the Bundle ID matching the widget id in the config.xml:

enter image description here

config.xml

<?xml version='1.0' encoding='utf-8'?>
<widget id="com.ionicframework.XXXXXXX" version="0.0.1" xmlns="http://www.w3.org/ns/widgets" xmlns:cdv="http://cordova.apache.org/ns/1.0">
    <name>theWhoZoo</name>

And it also has the REVERSED_CLIENT_ID matching the iOS URL scheme above.

<plugin name="cordova-plugin-googleplus" spec="~5.1.1">
    <variable name="REVERSED_CLIENT_ID" value="com.googleusercontent.apps.XXXXXX" />
</plugin>

I have also created a Firebase App for my Project that also has the matching Bundle ID (not sure if this has any effect):

enter image description here

Also, I am not sure if this makes any difference, but I add the the CLIENT_ID for iOS to the Google Firebase Authentication here:

enter image description here

Question

Are there any steps I am missing or doing something wrong to set this up for iOS?

Upvotes: 0

Views: 1759

Answers (2)

Abhishek Tomar
Abhishek Tomar

Reputation: 905

here is my code and this is working good with IOS.

Code

private nativeGoogleLogin(): Promise<firebase.User> {
    return new Promise(async (resolve, reject) => {
      const SCOPES = 'https://www.googleapis.com/auth/drive https://www.googleapis.com/auth/gmail.send https://www.googleapis.com/auth/plus.me';
      await this.gPlus.login({
          'webClientId': 'XXXXXXXX.apps.googleusercontent.com',
          'offline': true,
          'scopes': SCOPES
        }).then(res => {
            const googleCredential = firebase.auth.GoogleAuthProvider.credential(res.idToken , res.access_token);
            this.afAuth.auth.signInWithCredential(googleCredential).then(odata => {
              resolve(odata);
            }).catch(err => {
              reject(err);
            });
        }).catch(err => {
          reject(err);
        });
    });
  }

How to get displayName name 

async onGoogleLogin() {
    await this.goAuth.googleLogin().then(res => {
      alert(JSON.stringify(res));
      alert(res.providerData[0].displayName);
    }).catch(err => {
      console.log(err);
    });
  }

res.providerData[0].displayName

Note : Uninstall you app in emulator and clean your build folder before using this code.

Upvotes: 0

Tatsuyuki Ishi
Tatsuyuki Ishi

Reputation: 4031

This should add the required scope for fetching profile data:

window.plugins.googleplus.login({
  'scopes': 'https://www.googleapis.com/auth/plus.me',
  // continue below...

See the official documentation and the plugin documentation for details.

The scope is described here.

Upvotes: 1

Related Questions