Search code examples
meteormeteor-accounts

How to ask extra information after login with facebook?


I have set-up the basic meteor application where I am able to login with facebook. I would like to ask for a valid phone number before actually creating the user. How do you accomplish that in meteor? Login Workflow :

Login-page => Click 'login with facebook' => User gives permission to app => redirect back to app and ask for phone number => create user

I am using accounts-facebook and related packages.

Thanks


Solution

  • Since the Facebook API doesn't support access to the user phone, you can't just extend the requestPermission array, to ask for the user_phone.

    Lets say you have this simple, login With Facebook button

       Meteor.loginWithFacebook({ requestPermissions: ['email']},
        function (error) {
           if (error) {
            return console.log("There was an error : " error.reason);
          }else{
            //if there is no error, lets redirect the new user to a new template
            Router.go('/registerForm')
          }
        });
    

    Now that if the login was successful you can redirect the user into the registerForm.

    Register Form HTML

    <template name="registerForm">
      <!-- Simple Register Form asking for phone number -->
    </template>
    

    JS Event

     Template.registerForm.events({
        'submit registerForm':function(e,t){
           //code to get the input value
           var userPhoneNumber = t.$('#phoneInputValue').val()
           Meteor.users.update(Meteor.userId(),{$set:{'profile.phoneNumber':userPhoneNumber,'profileNumber':true}})
         }
      })
    

    Did you se the boolean value profileNumber? with this you can use template helpers to ensure and denied access to the user if he dosnt fill the registerForm template(just an extra security), you can set it by default on the server side using the Accounts.onCreateUser method like this.

    Accounts.onCreateUser(function(options, user) {
           if(!options || !user) {
            console.log('error creating user');
            return;
        } else {
            if(options.profile) {
                user.profile.userPhoneNumber = false;
            }
        }
        return user;
    });