Facebook API Question posted in
The official documentation for the Facebook APIs can be found here.

Using a web page, after sign up on Firebase, with Facebook

I have a small web site where users can sign in on Firebase, using email and password.

I uses this code:

<script>

function SignUpWithMailPSW(email,pswRdmSeq) {
    ....
    firebase.auth().createUserWithEmailAndPassword(email, pswRdmSeq).then(function(user) {
        ....
    }
    ... useful things irrelevant to the question.
}

</script>

Now users can also sign in using Facebook.

To get started I found this document. And to experiment I did something based on what I read, just a small test page. Here is the code:

<HTML>
<HEAD>
<META HTTP-EQUIV="content-type" CONTENT="text/html; CHARSET=UTF-8">
<script src="https://www.gstatic.com/firebasejs/6.3.5/firebase-app.js"></script>
<script src="https://www.gstatic.com/firebasejs/6.3.5/firebase-auth.js"></script>
</HEAD>
<BODY>

<script>
// Your web app's Firebase configuration
var firebaseConfig = {
    apiKey: "ABCDEF-APIKEY-12345",
    authDomain: "myapp.firebaseapp.com",
    databaseURL: "https://myapp.firebaseio.com",
    projectId: "myapp",
    storageBucket: "myapp.appspot.com",
    messagingSenderId: "123456789",
    appId: "1:987654321:web:xy2122k98xyxy8988"
};
// Initialize Firebase
firebase.initializeApp(firebaseConfig);
</script>

<b>TEST ONLY PAGE !!!</b>

<script>

var provider = new firebase.auth.FacebookAuthProvider();

function SignUpWithFB() {

    // var provider = new firebase.auth.FacebookAuthProvider();

    firebase.auth().signInWithPopup(provider).then(function(result) {
    // This gives you a Facebook Access Token. You can use it to access the Facebook API.
    var token = result.credential.accessToken;
    // The signed-in user info.
    var user = result.user;
    // ...
    }).catch(function(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;
    // ...
    });
}

SignUpWithFB();

</script>

<b>TEST ONLY PAGE !!!</b>
</BODY>
</HTML>

At this point it is starting to work.

But I would like to know how to make use of the result (and result.credential) parameter that we get in the call back function (or promise?):

firebase.auth().signInWithPopup(provider).then(function(result) {});

I did not find anything significant about this result variable (type, fields, use, ..etc..) searching the net.

Some hints would be very useful.

Tags:

2

Answers


  1. 0

    The result variable which you are getting in the then part of the promise , is an object (type) holding all the information about the user. And contains a lot of properties on itself, using which you can get all of these data very easily.

    Naming a few important ones

    • displayName : Gives you User’s display name
    • email : Gives you the user’s email ID
    • emailVerified : Tells you whether the email-ID is verified or not
    • metadata : Itself a object containing info such as LastSignInTime and creationTime
    • photoURL : A URL to the picture of user, the current one.
    • uid : (very useful) Unique ID associated with each user, which will let you do many authentication ahead.

    Note : To list and check all these property , try outputting it in console
      console.log(result);

    Login or Signup to reply.
  2. 0

    The signInWithPopup method is declared as:

    signInWithPopup(provider: AuthProvider): Promise<UserCredential>

    So it returns Promise<UserCredential>. This means that in your then callback you get a UserCredential object, which is declared as:

    Optional additionalUserInfo?: AdditionalUserInfo | null
credential: AuthCredential | null
Optional operationType?: string | null
user: User | null

    So it has a user and a credential property, and may also have additionalUserInfo and operationType.

    For more information on each of these, keep following the links in the reference documentation.

    Login or Signup to reply.
Please signup or login to give your own answer.

Back To Top
Search