Ad

Firebase Facebook OAuth AddScope()

I am using firebase with angular and oAuth with the firebase facebook provider. Everything is working fine. However, when I am trying to add a new scope (user_friends) for examples I don't get any data (the popup asks me for the correct scopes):

//auth.service.ts
 signInWithFacebook() {
    const provider =  new firebase.auth.FacebookAuthProvider();
    provider.addScope("user_friends");
    return this.oAuthLogin(provider);
 }
 private oAuthLogin(provider) {
    return this._firebaseAuth.auth.signInWithPopup(provider)
    .then((credential) => {
       this.updateUserData(credential.user)
    })
 }

So the credential got basic userInformation (displayName, photoUrl) as usual. I tried to look for the returned Promise as a callback :

type UserCredential = {
   additionalUserInfo?: firebase.auth.AdditionalUserInfo | null;
   credential: firebase.auth.AuthCredential | null;
   operationType?: string | null;
   user: firebase.User | null;
};

We can see that there is a firebase.user getting alot of method but no adding string for my new scope.

interface UserInfo {
    displayName: string | null;
    email: string | null;
    phoneNumber: string | null;
    photoURL: string | null;
    providerId: string;
    uid: string;
}

Thus I dont see how my user_friends data, which is an array (below) can be added to the credentials data (which method?) and displayed in my console.

"friends": {
  "data": [
    //friends id and their name
  ],

  "summary": {
    "total_count": 631
  }
}

thanks for your help !

Ad

Answer

I actually found a solution, and wanted to share for the lost souls like me.

1) The addScope() method is just a method for asking additional scopes in the oAuth popup, no data provided in the callback.

2) Getting Facebook additional scopes needs to be done with the AccessToken through the graphUrl like an API

3) Here the code to get a viable accessToken :

private oAuthLogin(provider) {
return this._firebaseAuth.auth.signInWithPopup(provider)
  .then((result) => {
      this.token = result.credential["accessToken"];
    this.updateUserData(result.user)
  })
}

The firebase/js documentation get the AccessToken through result.credential.accessToken, but it generates a typescript error in many cases (alot of people got this error message).

Thus, Getting Facebook friends list (with GraphUrl) for example :

  getFacebookFriendsList() {
var graphUrl = 'https://graph.facebook.com/me/friends?access_token=' + this.token;
return this.http.get(graphUrl);
}
Ad
source: stackoverflow.com
Ad