In this article I will explain with an example, how to login with FaceBook account in ASP.Net Website using C# and VB.Net.
The user will be authenticated using FaceBook account and get FaceBook profile details like UserId, Name, Email and Profile picture in ASP.Net using the ASPSnippets FaceBook API.
 
 
Create FaceBook Application and get App Id
You will need to create an application and get an API Key and API Secret.
 
 
Download ASPSnippets FaceBook API
You can download the latest ASPSnippets FaceBook API from the following link..
Note: You will need to add the reference of ASPSnippets FaceBook API DLL in your project.
 
 
HTML Markup
Following HTML Markup consists of:
Button – For authenticate the user through FaceBook.
The Button has been assigned with an OnClick event handler.
Image – For displaying Profile picture.
Label – For displaying FaceBook Id, Name and Email.
<asp:Button ID="btnLogin" runat="server" Text="Login with FaceBook" OnClick="Login" />
<asp:Panel ID="pnlFaceBookUser" runat="server" Visible="false">
    <hr/>
    <table>
        <tr>
            <td rowspan="5" valign="top">
                <asp:Image ID="ProfileImage" runat="server" Width="70" Height="70" />
            </td>
        </tr>
        <tr>
            <td>ID:<asp:Label ID="lblId" runat="server" Text=""></asp:Label></td>
        </tr>
        <tr>
            <td>Name:<asp:Label ID="lblName" runat="server" Text=""></asp:Label></td>
        </tr>
        <tr>
            <td>Email:<asp:Label ID="lblEmail" runat="server" Text=""></asp:Label></td>
        </tr>
    </table>
</asp:Panel>
 
 
Namespaces
You will need to import the following namespaces.
C#
using ASPSnippets.FaceBookAPI;
using System.Web.Script.Serialization;
 
VB.Net
Imports ASPSnippets.FaceBookAPI
Imports System.Web.Script.Serialization
 
 
Property Classes
Following class will be used to hold the user profile details returned from FaceBook after authentication.
C#
public class FaceBookUser
{
    public string Id { get; set; }
    public string Name { get; set; }
    public string Email { get; set; }
    public FaceBookUserPicture Picture { get; set; }
}
 
public class FaceBookUserPicture
{
    public Data Data{ get; set; }
}
 
public class Data
{
      public string Url { get; set; }
}
 
VB.Net
Public Class FaceBookUser
    Public Property Id As String
    Public Property Name As String
    Public Property Email As String
    Public Property Picture As FaceBookUserPicture
End Class
 
Public Class FaceBookUserPicture
    Public Property Data As Data
End Class
 
Public Class Data
    Public Property Url As String
End Class
 
 
Authenticating user using FaceBook account
When the Login button is clicked, page will be redirected to FaceBook for inputting user details for authentication using the Authorize method of FaceBookConnect class.
C#
protected void Login(object sender, EventArgs e)
{
    FaceBookConnect.Authorize("user_photos,email", Request.Url.AbsoluteUri.Split('?')[0]);
}
 
VB.Net
Protected Sub Login(sender As Object, e As EventArgs)
    FaceBookConnect.Authorize("user_photos,email", Request.Url.AbsoluteUri.Split("?"c)(0))
End Sub
 
 
Fetching the user’s FaceBook Profile details
Inside the Page_Load event handler, the FaceBookConnect class API_Key, API_Secret and Version properties are set.
Then, inside the not IsPostBack condition, a check is performed whether any error or not.
If there is no error, the access code (access token) is retrieved from the Query String and based on the access code, user’s FaceBook profile details are fetched like FaceBook Id, Name, Email and Profile picture and set in the respective controls.
Finally, the Login button is disabled.
C#
protected void Page_Load(object sender, EventArgs e)
{
    FaceBookConnect.API_Key = "<Your API Key>";
    FaceBookConnect.API_Secret = "<Your API Secret>";
    FaceBookConnect.Version = "v19.0";
    if (!this.IsPostBack)
    {
        if (Request.QueryString["error"] == "access_denied")
        {
            ClientScript.RegisterStartupScript(this.GetType(), "alert", "alert('User has denied access.')", true);
            return;
        }
 
        string code = Request.QueryString["code"];
        if (!string.IsNullOrEmpty(code))
        {
            string data = FaceBookConnect.Fetch(code, "me", "id,name,email,picture");
            FaceBookUser faceBookUser = new JavaScriptSerializer().Deserialize<FaceBookUser>(data);
            pnlFaceBookUser.Visible = true;
            lblId.Text = faceBookUser.Id;
            lblName.Text = faceBookUser.Name;
            lblEmail.Text = faceBookUser.Email;
            ProfileImage.ImageUrl = faceBookUser.Picture.Data.Url;
            btnLogin.Enabled = false;
        }
    }
}
 
VB.Net
Protected Sub Page_Load(sender As Object, e As EventArgs) Handles Me.Load
    FaceBookConnect.API_Key = "<Your API Key>"
    FaceBookConnect.API_Secret = "<Your API Secret>"
    FaceBookConnect.Version = "v19.0"
 
    If Not Me.IsPostBack Then
        If Request.QueryString("error") = "access_denied" Then
            ClientScript.RegisterStartupScript(Me.GetType(), "alert", "alert('User has denied access.')", True)
            Return
        End If
 
        Dim code As String = Request.QueryString("code")
        If Not String.IsNullOrEmpty(code) Then
            Dim data As String = FaceBookConnect.Fetch(code, "me", "id,name,email,picture")
            Dim faceBookUser As FaceBookUser = New JavaScriptSerializer().Deserialize(Of FaceBookUser)(data)
            pnlFaceBookUser.Visible = True
            lblId.Text = faceBookUser.Id
            lblName.Text = faceBookUser.Name
            lblEmail.Text = faceBookUser.Email
            ProfileImage.ImageUrl = faceBookUser.Picture.Data.Url
            btnLogin.Enabled = False
        End If
    End If
End Sub
 
 
Screenshot
Login with FaceBook account in ASP.Net Website
 
 
Demo
 
 
Downloads