Login With Facebook Using API In PHP

March 24, 2016 (last updated on: March 1, 2017)
Tutorials
4 Comments
7,681 Views

The easy way to Login With Facebook using API in PHP, create Login With Facebook easily, tutorial and example PHP script for download.

How To Create Login With Facebook In PHP

Very easy, using Facebook Graph API and some PHP functions, we will create login with facebook to our website, no need to use cURL!.

Create Facebook App

We will use Facebook API v2.8 only. Go to Facebook Developers and create a new App, we need “App ID” and “App Secret” and “redirect_uri”:

Click on “Add Product” and choose “Facebook Login”:

Now go to “Facebook Login” > “Settings” and enter your “redirect_uri”:

Create Login With Facebook

Now we will use our Facebook App to create Login With Facebook to our website, we need 6 PHP files:

index.php
config.php
login.php
callback.php
success.php
logout.php

Create new PHP file “index.php” and enter this code inside it:

<?php

    // Script By Qassim Hassan, wp-time.com

    session_start();

    if( isset($_SESSION['success']) ){ // if user is logged in
        ?>
            <h3>Welcome <?php echo $_SESSION["first_name"]; ?> <?php echo $_SESSION["last_name"]; ?> !</h3>
            <p><img src="<?php echo $_SESSION['picture']; ?>"></p>
            <p>Your Email is: <?php echo $_SESSION["email"]; ?></p>
            <p><a href="logout.php">Logout</a></p>
        <?php
    }

    else{ // if user is not logged in
        echo '<a href="login.php">Login With Facebook</a>';
    }

?>

Now create new PHP file “config.php” and enter this code inside it:

<?php

    // Script By Qassim Hassan, wp-time.com

    // go to https://developers.facebook.com and create a new app

    $app_id = "xxxxxx"; // enter your app id

    $app_secret = "xxxxxx"; // enter your app secret

    $redirect_uri = "http://localhost/login-with-facebook/callback.php"; // enter your redirect url (Site URL from app settings)

    $scope = "public_profile,email"; // we need scope of public_profile and email, but you can change it for another result, check list of scopes: https://developers.facebook.com/docs/facebook-login/permissions

?>

Now create new PHP file “login.php” and enter this code inside it:

<?php

    session_start();

    // Script By Qassim Hassan, wp-time.com

    if( isset($_SESSION['success']) ){ // check if user is logged in
        header("location: index.php"); // redirect user to index page
        return false;
    }

    include 'config.php'; // include app info

    $_SESSION['login'] = 1;

    header("location: https://www.facebook.com/dialog/oauth?client_id=$app_id&redirect_uri=$redirect_uri&scope=$scope"); // redirect user to oauth page

?>

Now create new PHP file “callback.php” and enter this code inside it:

<?php

    session_start();

    // Script By Qassim Hassan, wp-time.com

    if( isset($_SESSION['success']) or !isset($_SESSION['login']) ){ // check if user is logged in
        header("location: index.php"); // redirect user to index page
        return false;
    }

    include 'config.php'; // include app info

    $code = str_replace("#_=_", "", $_GET['code']); // CODE from code parameter: http://localhost/login-with-facebook/callback.php?code=XXXXXX

    $api = "https://graph.facebook.com/v2.8/oauth/access_token?client_id=$app_id&redirect_uri=$redirect_uri&client_secret=$app_secret&code=$code";

    $get_content = file_get_contents($api); // get result

    $json = json_decode($get_content, true); // convert result to json array

    $access_token = $json['access_token']; // user access token

    $_SESSION['access_token'] = $access_token; // save user access token in session

    header("location: success.php"); // redirect user to success page

?>

Now create new PHP file “success.php” and enter this code inside it:

<?php

    session_start();

    // Script By Qassim Hassan, wp-time.com
    include 'config.php';

    $access_token = $_SESSION['access_token']; // user access token

    if( isset($_SESSION['success']) or !isset($_SESSION['access_token']) ){ // check if user is logged in
        header("location: index.php"); // redirect user to index page
        return false;
    }

    /* Get User Picture */

    $width = 160; // picture width, change it if you want

    $height = 160; // picture height, change it if you want

    $get_picture = "https://graph.facebook.com/me/picture?redirect=0&width=$width&height=$height&access_token=$access_token";

    $content_picture = file_get_contents($get_picture);

    $picture_json = json_decode($content_picture, true);

    $user_picture = $picture_json["data"]["url"]; // user picture link

    /* Get User Info */

    $get_info = "https://graph.facebook.com/me/?fields=email,name,first_name,last_name,id&access_token=$access_token";

    $content_info = file_get_contents($get_info);

    $info_json = json_decode($content_info, true);

    $_SESSION["first_name"] = $info_json['first_name']; // save user first name in session

    $_SESSION["last_name"] = $info_json['last_name']; // save user last name in session

    $_SESSION["email"] = $info_json['email']; // save user email in session

    $_SESSION["picture"] = $user_picture; // save user picture link in session

    $_SESSION['success'] = 1;

    header("location: index.php"); // finally, redirect user to index page

?>

Finally, create new PHP file “logout.php” and enter this code inside it:

<?php

    session_start();

    /* Script By Qassim Hassan, wp-time.com */

    // if user is logged in, destroy all facebook sessions
    if( isset($_SESSION['success']) or isset($_SESSION['access_token']) or isset($_SESSION['login']) ){
        unset( $_SESSION['success'] ); // destroy
        unset( $_SESSION['access_token'] ); // destroy
        unset( $_SESSION['login'] ); // destroy
        header("location: index.php"); // redirect user to index page
    }

    else{ // if user is not logged in
        header("location: index.php"); // redirect user to index page
    }

?>

Done.