Facebook Authentication to my PHP Page

Question

I am trying to allow users to register on my page using Facebook. This is how I connect / Login to Facebook (Just the JS code).

function statusChangeCallback(response) {
    if (response.status === 'connected') {
        // Logged into your app and Facebook.

        FB.api('/me', function(response) {
            var reg_Name = response.first_name;
            var reg_Surname = response.last_name;
            var reg_Email = response.email;

            //$.post("System/External.php?function=login_facebook")
        });

        console.log(response);
    } else if (response.status === 'not_authorized') {
        // The person is logged into Facebook, but not your app.
        alert('Please log into this application to continue.');
    } else {
        // The person is not logged into Facebook, so we're not sure if
        // they are logged into this app or not.
        alert('Please log into Facebook to continue.');
    }
}

function checkLoginState() {
    FB.getLoginStatus(function(response) {
        statusChangeCallback(response);
    });
}

window.fbAsyncInit = function() {
    FB.init({
        appId      : 'app_key',
        cookie     : true,  // enable cookies to allow the server to access
        // the session
        xfbml      : true,  // parse social plugins on this page
        version    : 'v2.0' // use version 2.0
    });

    FB.getLoginStatus(function(response) {
        statusChangeCallback(response);
    });

};

// Load the SDK asynchronously
(function(d, s, id) {
    var js, fjs = d.getElementsByTagName(s)[0];
    if (d.getElementById(id)) return;
    js = d.createElement(s); js.id = id;
    js.src = "//connect.facebook.net/en_US/sdk.js";
    fjs.parentNode.insertBefore(js, fjs);
}(document, 'script', 'facebook-jssdk'));

My Problem is that I want to to login after it is registered. I will use a $.post request to register, but now what will be the best way to Authenticate the actual login as you cannot retrieve the users FB password?

I want the page to perform an actual login authentication (From my site) when the user logs into Facebook. Example:

There will be 2 methods in which to login to my site.

1. Use my login interface (Which will log you in when the username and password is correct).
2. Use Facebook (Which should then post the data to the same PHP page as the Login through my site - So it would be as if the user logged in through my site).

My first attempt was to use the Persons Email to login to the site (But then a users account can easily be hacked if someone obtains their email). I don't want the user to have to input a password after he has already authenticated his Facebook account.

I cant use a combination of Facebook Email and IP address because your IP changes every time you connect to the internet. (Defeats the point of logging in without a password).

Below is the response from Facebook upon a successful login.

email: "my_email address"
first_name: "My Name"
gender: "male"
id: "1508539292713828"
last_name: "My Surname"
link: "https://www.facebook.com/app_scoped_user_id/1508539292713828/"
locale: "en_US"
name: "Full name"
timezone: 2
updated_time: "2014-06-26T08:21:36+0000"
verified: true

Answer 1

You can use the PHP SDK on the server side to check if the user is logged in using:

// initialize SDK here

// If this returns the user ID, the user is logged in
if ($userId = $facebook->getUser()) {
    try {
        $userData = $facebook->api('/me');
    } catch (Exception $e) {
        echo $e->getMessage();
        exit();
    }

    $email = $userData["email"];

    // Do whatever
}

Edit: The flow would be: log the user in using the JS SDK, then send an AJAX request in the FB.login callback, where you check if the user is logged in using the PHP SDK.