Skip to main content

Facebook login integration in ASP.NET from DOTNET FOX posts

Here is the link to original post: http://www.dotnetfox.com/Articles.aspx?id=1058

as it is post is copied here

How to integrate facebook login authentication in ASP.NET
Facebook has provided functionality that extends the Facebook Platform to any website that wants to integrate Facebook APIs for user authentication, sharing website content with friends, and publishing feed stories to generate traffic.
Here I’ll show you how to integrate Facebook login authentication for ASP.NET website. You could follow the steps here I’ve given below.
 Step-1:                                                 
          First we have to create new application in Facebook. While creating New App we have to enter app name. Here we don’t need to consider about Namespace and category. Follow the link to create new app in Facebook
 
 Step-2:
             Here we have to enter captcha text for security purpose.

Step-3:
             After submit security check our app would be created and it would be look like this. After we have to enter our website URL.  
 

Note:
            We can’t able to run Facebook login authentication on Local.        
Step-4:
          We almost ready to use Facebook login authentication in our website. You just create design source like this and you have to change App ID which is available in your facebook App.

Designer source code:
<%@ Page Language="C#" AutoEventWireup="true" CodeFile="FB-Login.aspx.cs" Inherits="_Default" %> 
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
    <title>Facebook login</title>
    <script src="http://code.jquery.com/jquery-latest.js" type="text/javascript"> 
</script>
</head>
<body>
    <form id="form1" runat="server">
    <div>
    <table align="center"><tbody> 
<tr> <td align="center" style="color: #33ccff; font-size: large; font-weight: bold; text-transform: capitalize;"></td></tr> 
<tr> <td align="center" style="margin-top: 350px;"><script type="text/javascript">
   // Load the SDK Asynchronously 
(function (d) {
    var js, id = 'facebook-jssdk', ref = d.getElementsByTagName('script')[0];
    if (d.getElementById(id)) { return; }
    js = d.createElement('script'); js.id = id; js.async = true;
    js.src = "//connect.facebook.net/en_US/all.js";
    ref.parentNode.insertBefore(js, ref);
} (document));

// Init the SDK upon load
window.fbAsyncInit = function () {
    FB.init({
        appId: 'Your App ID'// App ID 
        channelUrl: '//' + window.location.hostname + '/channel'// Path to your Channel File 
        status: true// check login status 
        cookie: true// enable cookies to allow the server to access the session 
        xfbml: true  // parse XFBML 
    });

    // listen for and handle auth.statusChange events 
    FB.Event.subscribe('auth.statusChange'function (response) {
        if (response.authResponse) {
            // user has auth'd your app and is logged into Facebook 
            FB.api('/me'function (me) {
                if (me.name) {
                    document.getElementById('auth-displayname').innerHTML = me.name;
                }
            })
            document.getElementById('auth-loggedout').style.display = 'none';
            document.getElementById('auth-loggedin').style.display = 'block';
        } else {
            // user has not auth'd your app, or is not logged into Facebook 
            document.getElementById('auth-loggedout').style.display = 'block';
            document.getElementById('auth-loggedin').style.display = 'none';
        }
    });
    $("#auth-logoutlink").click(function () { FB.logout(function () { window.location.reload(); }); });
}
</script> 
<h1> 
    Dotnetfox- Facebook login integration</h1>
<div id="auth-status"> 
<div id="auth-loggedout"> 
<div autologoutlink="true" class="fb-login-button" scope="email,user_checkins"> 
Login with Facebook</div> 
</div> 
<div id="auth-loggedin" style="display: none;"> 
Hi, <span id="auth-displayname">  Welcome to Dotnetfox </span> (<a href="#" id="auth-logoutlink">Signout</a>)</div> 
</div> 
</td> </tr> 
</tbody> </table> 
    </div>
    </form>
</body>
</html>

Popular posts from this blog

Creating package in Oracle Database using Toad For Oracle

What are Packages in Oracle Database A package is  a group   of procedures, functions,  variables   and  SQL statements   created as a single unit. It is used to store together related objects. A package has two parts, Package  Specification  and Package Body.

Resolving 'Setup Account Privileges' error while installing SQL Server

A new installation of Microsoft SQL Server 2012 or Microsoft SQL Server 2008 R2 fails You see the following error message when you try to install a new instance of SQL Server 2012 or SQL Server 2008 R2: Rule "Setup account privileges" failed.

Creating Oracle stored Procedures using TOAD for Oracle

In a database management system, a  stored procedure  is a set of Structured Query Language (SQL) statements with an assigned name that's stored in the database in compiled form so that it can be shared by a number of programs. The use of  stored procedures  can be helpful in controlling  access to data, preserving  data integrity  and  improving  productivity.