Login With Facebook oAuth Using PHP And MySQL

In this day’s users are not interested in filling a huge form to user registration. Quick user registration method helps to get more visitors to your website. Login with Facebook is a fast and great way to integrate user registration and login method on the website. The Facebook is a fabulous and popular social network and a maximum of the users have a Facebook account. Facebook Login authorize the users to login into your website, Through their Facebook account credentials without sign up on your website.

In this post, we going to see login with Facebook oAuth using PHP and MySQL. Let me explain how you can implement user registration and login operation with Facebook using PHP. Now we going to save the user data into the MySQL database. We’ll use Facebook PHP SDK v4 with Facebook API to create Facebook Login method with PHP and MySQL.

Step 1 – Create an Facebook App to get the App ID and App Secret Key
— Goto https://developers.facebook.com/apps/ and Click Add a New App .
— Create a New APP ID and Enter Display name and Contact Email.
— Now Click Create APP ID

Step 2 – Now choose website.

Step 3 – Provide Values for Website URL

Step 5 – Now below App Review, Click the button to make you App public.

   

conn.php

<?php
define('db_host', 'localhost');
define('db_user', 'admin-mk');
define('db_password', 'SunMoonMohan');
define('db_name', 'demo_softaox');
$conn = mysql_connect(db_host, db_user, db_password) or die( "Connection Error".mysql_error());
$database = mysql_select_db(db_name) or die( "Unable to select database");
?>
index.php

<?php
session_start(); 
?>
<!doctype html>
<html xmlns:fb="http://www.facebook.com/2008/fbml">
<head>
    <title>SoftAOX | Login With Facebook oAuth Using PHP And MySQL</title>
    <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css" />
<style>
.white {
    color: #000;
    background-color: #fff;
}
.btn-facebook {
    color: #ffffff;
    -webkit-text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.25);
    text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.25);
    background-color: #2b4b90;
    *background-color: #133783;
    background-image: -moz-linear-gradient(top, #3b5998, #133783);
    background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#3b5998), to(#133783));
    background-image: -webkit-linear-gradient(top, #3b5998, #133783);
    background-image: -o-linear-gradient(top, #3b5998, #133783);
    background-image: linear-gradient(to bottom, #3b5998, #133783);
    background-repeat: repeat-x;
    border-color: #133783 #133783 #091b40;
    border-color: rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.25);
    filter: progid: DXImageTransform.Microsoft.gradient(startColorstr='#ff3b5998', endColorstr='#ff133783', GradientType=0);
    filter: progid: DXImageTransform.Microsoft.gradient(enabled=false);
}
.btn-facebook:hover,
.btn-facebook:focus,
.btn-facebook:active,
.btn-facebook.active,
.btn-facebook.disabled,
.btn-facebook[disabled] {
    color: #ffffff;
    background-color: #133783 !important;
    *background-color: #102e6d !important;
}
.btn-facebook:active,
.btn-facebook.active {
    background-color: #0d2456 \9 !important;
}
</style>

</head>
<body>
	<?php if ($_SESSION['fb_id']): ?>  
<!--  After login  -->
<div class="container">
    <div class="row">
        <h1 align="center">Hi, <?php echo $_SESSION['user_name']; ?></h1>
        <p align="center">Welcome to Facebook Login</p>
        <div class="col-xs-12 col-sm-12 col-md-12">
            <div class="well well-sm">
                <div class="row">
                    <div class="col-sm-2 col-md-4">
                        <img class="img-rounded" src="https://graph.facebook.com/<?php echo $_SESSION['fb_id']; ?>/picture">
                    </div>
                    <div class="col-sm-10 col-md-8">
                        <p>Facebook ID: <?php echo  $_SESSION['fb_id']; ?></p>
                        <h4>User Name: <?php echo $_SESSION['user_name']; ?></h4>
                            <!-- Split button -->
                            <div class="btn-group">
                                <a href="logout.php" class="btn btn-primary">Logout</a>
                            </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>
	<?php else: ?>
<!-- Before login --> 
<div class="container">
    <h1 align="center">Login With Facebook oAuth Using PHP And MySQL</h1>
    <br/>
    <br/>
    <br/>
    <div class="row">
        <div class="col-md-4 col-md-offset-4">
            <div class="panel panel-default">
                <div class="panel-heading">
                    <h3 class="panel-title">Login</h3>
                </div>
                <div class="panel-body">
                    <form accept-charset="UTF-8" role="form">
                        <fieldset>
                            <div class="form-group">
                                <input class="form-control" placeholder="Enter Your Email ID" name="email" type="text">
                            </div>
                            <div class="form-group">
                                <input class="form-control" placeholder="Password" name="password" type="password" value="">
                            </div>
                            <div class="checkbox">
                                <label>
                                    <input name="remember" type="checkbox" value="Remember Me"> Remember Me
                                </label>
                            </div>
                            <input class="btn btn-lg btn-success btn-block" type="submit" value="Login">
                        </fieldset>
                    </form>
                    <hr/>
                    <center>
                        <h4>OR</h4></center>
                    <a href="fbconfig.php" class="btn btn-lg btn-facebook btn-block" role="button">Login via facebook</a>
                </div>
            </div>
        </div>
    </div>
</div>
    <?php endif ?>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/js/bootstrap.min.js"></script>
</body>
</html>
insert.php

<?php
require 'conn.php';
function checkuser($facebook_id, $facebook_user)
{
    $check = mysql_query("select * from facebook_oauth where facebook_id='$facebook_id'");
    $check = mysql_num_rows($check);
    if (empty($check)) { // New user Insertion       
        $query = "INSERT INTO facebook_oauth (facebook_id,facebook_user) VALUES ('$facebook_id','$facebook_user')";
        mysql_query($query);
    } else { // Returned user data update        
        $query = "UPDATE facebook_oauth SET facebook_user='$facebook_user' where facebook_id='$facebook_id'";
        mysql_query($query);
    }
}
?>
fbconfig.php

<?php
session_start();
// added in v4.0.0
require_once 'insert.php';
require_once 'autoload.php';
use Facebook\FacebookSession;
use Facebook\FacebookRedirectLoginHelper;
use Facebook\FacebookRequest;
use Facebook\FacebookResponse;
use Facebook\FacebookSDKException;
use Facebook\FacebookRequestException;
use Facebook\FacebookAuthorizationException;
use Facebook\GraphObject;
use Facebook\Entities\AccessToken;
use Facebook\HttpClients\FacebookCurlHttpClient;
use Facebook\HttpClients\FacebookHttpable;
// init app with app id and secret
FacebookSession::setDefaultApplication('Your App ID', 'Your App Secrete');
// login helper with redirect_uri
$helper = new FacebookRedirectLoginHelper('http://preview.softaox.info/facebookaoth/fbconfig.php');
try {
    $session = $helper->getSessionFromRedirect();
}
catch (FacebookRequestException $ex) {
    // When Facebook returns an error
}
catch (Exception $ex) {
// When validation fails or other local issues
}
// see if we have a session
if (isset($session)) {
    // graph api request for user data
    $request               = new FacebookRequest($session, 'GET', '/me');
    $response              = $request->execute();
    // get response
    $graphObject           = $response->getGraphObject();
    $fb_id                 = $graphObject->getProperty('id'); // To Get Facebook ID
    $fbuser_name           = $graphObject->getProperty('name'); // To Get Facebook full name
    /* ---- Session Variables -----*/
    $_SESSION['fb_id']     = $fb_id;
    $_SESSION['user_name'] = $fbuser_name;
    
    checkuser($_SESSION['fb_id'], $_SESSION['user_name']);
    
    /* ---- Redirection location after session ----*/
    header("Location: index.php");
} else {
    $loginUrl = $helper->getLoginUrl();
    header("Location: " . $loginUrl);
}
?>
logout.php

<?php
session_start();
session_unset();
$_SESSION['fb_id']     = NULL;
$_SESSION['user_name'] = NULL;
header("Location: index.php");
?>

Was this article helpful?

Yes No
×

How can we improve it?

×

We appreciate your helpul feedback!

Your answer will be used to improve our content. The more feedback you give us, the better our pages can be.

Follow us on social media:

Facebook Pinterest
Share via:

Mraj

Creative Designer & Developer specialist by the spirit and a loving blogger by thoughts.

2 Comments

Leave a Reply