Facebook Login (Javascript)

Sample Javascript:

var fb_token = '';
var fb_id = '';

function statusChangeCallback(response) {  // Called with the results from FB.getLoginStatus().
    console.log('statusChangeCallback');
    //console.log(response);                   // The current login status of the person.
    if (response.status === 'connected') {   // Logged into your webpage and Facebook.
        //fb_token = response.authResponse.accessToken;
        //fb_id = response.authResponse.userID;
        //testAPI(); 
        fb_app.auto_login();
    } else {                                 // Not logged into your webpage or we are unable to tell.
        document.getElementById('status').innerHTML = 'Please log ' +
            'into this webpage.';
    }
}

function checkLoginState() {  
    console.log('checkLoginState'); // Called when a person is finished with the Login Button.
    FB.getLoginStatus(function(response) {// See the onlogin handler
        statusChangeCallback(response);
    });
}

window.fbAsyncInit = function() {
    FB.init({
        appId      : '1116666666',
        cookie     : true,                     // Enable cookies to allow the server to access the session.
        xfbml      : true,                     // Parse social plugins on this webpage.
        version    : 'v7.0'           // Use this Graph API version for this call.
    });
};
  
(function(d, s, id) {                      // Load the SDK asynchronously
    var js, fjs = d.getElementsByTagName(s)[0];
    if (d.getElementById(id)) return;
    js = d.createElement(s); js.id = id;
    js.src = "https://connect.facebook.net/en_US/sdk.js";
    fjs.parentNode.insertBefore(js, fjs);
}(document, 'script', 'facebook-jssdk'));

 
function testAPI() {                      // Testing Graph API after login.  See statusChangeCallback() for when this call is made.
    console.log('Welcome!  Fetching your information.... ');
    FB.api(
        '/me?fields=name,email', 
        function(response) {
            console.log(response);
            console.log('Successful login for: ' + response.name);
        }
    );
}


$(document).ready(function(){
    fb_app.init();
});

var fb_app = function(){
 
    function init(){
        $('#login_fb, #signup_fb').on('click', function(e){
            e.preventDefault();
            FB.login(function(response) {
                console.log('FB.login');
                console.log(response);
                checkLoginState();
            }, {scope: 'public_profile,email'});
        });

        //Test in dev
        //login();
    }

    function auto_login(){
        FB.api(
            '/me?fields=name,email', 
            function(response) {
                console.log(response);
                login(response);
            }
        );
    }

    function login(data){
        var params = data;
        /* Test data
        var params = {
            name: "RRR", 
            email: "[email protected]", 
            id: "102200000000000000"
        }
        */

        $.ajax({
            type: 'post',
            url: front_base + '/member/login_fb_memebr',
            data: params,
            dataType: 'json',
            success: function(res){
                if(typeof res.status == 'undefined'){
                    alert(res);
                }else if(res.status == 'fail'){
                    alert(res.message);
                }else{
                    //console.log(res);
                    var data = res.data;
                    alert('登入成功');
                    if(data == 'cart'){
                        window.location.href = front_base + '/cart/checkout/';
                    }else{
                        window.location.href = front_base + '/member/';
                    }
                }
            },
            error: function(res){
                console.log(res);
            }
        });
    }
 
    return {
        init: init, 
        auto_login: auto_login
    }
}();

PHP Example (Laravel)

    public function login_fb_memebr(Request $req){
        $data = $req->input();
        //logg($data);

        $member = MemberM::where('email', $data['email'])
            ->first();
        if($member == false){
            //自動註冊
            $member = new MemberM;
            $member->fb_id = $data['id'];
            $member->email = $data['email'];
            $member->name = $data['name'];
            $member->password = Hash::make($data['id']);
            $member->type = 2;
            $member->save();

            $this->send_reg_email($member->id);
        }else{
            //如果再用goggle登入就被蓋掉，所以每次都要更新
            $member->fb_id = $data['id'];
            $member->password = Hash::make($data['id']);
            $member->type = 2;
            $member->save();
        }

        $remember = true;
        $credentials = [
            'email' => $data['email'],
            'password' => $data['id']
        ];
        //logg($credentials);
        //logg(Hash::make($password));
        $result = $this->guard()->attempt($credentials, $remember);

        $cart = new Cart;
        if($cart->item_count() > 0){
            return $this->success_response('cart');
        }else{
            return $this->success_response(true);
        }
    }

Reference: