How to use facebook login and login or connect to my asp.net website?

Question

can someone give me the best approximate website url to use how to use facebook or facebook connection on my website or facebook with asp.net website?

In fact, my requirement is that when I registered on my asp.net site using facebook at that time, we want to get facebook username (email) from facebook, first and last name and picture of the user.

Answer 1

use the facebook javascript SDK, because using the javascript SDK you can easily and easily do it on facebook. I give you sample code for this

<script type="text/javascript" src="http://connect.facebook.net/en_US/all.js"></script> <div id="fb-root"> </div> <script type="text/javascript"> FB.init({ appId: '012341352533212', status: true, // check login status cookie: true, // enable cookies to allow the server to access the session xfbml: true, // parse XFBML channelUrl: 'http://www.xyz.com/channel.html', // channel.html file oauth: true // enable OAuth 2.0 }); </script> 

this code calls your facebook application

  <script type="text/javascript"> function facebookLogin() { FB.login(function (response) { if (response.authResponse) { FB.api('/me', function (response) { jQuery('#txtFirstName').val(response.first_name); jQuery('#txtLastName').val(response.last_name); jQuery('#txtEmail').val(response.email); jQuery('#hdfUID').val(response.id); // FB.logout(function (response) { // }); }); } else { jQuery('#txtFirstName').val(''); jQuery('#txtLastName').val(''); jQuery('#txtEmail').val(''); jQuery('#hdfUID').val(''); } }, { scope: 'email' }); return false; } </script> 

and this facebook code call login page, and in this answer you will get the user id, name. surname and email address of a specific user and using jquery save these values ​​in a text field or in a hidden field and get these values ​​on the server side code page.

Answer 2

Here I am going to write a step-by-step procedure for this.

• You need to enter the fb developers section using the link.
• Create a new application by clicking on the link.

• Write the name of your required application ie login, test, etc., as you can see from the screen below

• Fill in the required values ​​of the text field, see the screenshot for this. Now you take steps to create an entrance to the application for developers, open a visual studio and create an asp.net page with the aspx extension in visual studio.

• copy and paste the javascript code below into the chapter section of your page.

 <script> // 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: '155578484623690', // Write your own application id channelUrl: '//' + window.location.hostname + '/channel', // Path to your Channel File scope: 'id,name,gender,user_birthday,email', 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 var uid = "http://graph.facebook.com/" + response.authResponse.userID + "/picture"; FB.api('/me', function (me) { if (me.name) { document.getElementById('auth-displayname').innerHTML = me.name; document.getElementById('Email').innerHTML = me.email; document.getElementById('BD').innerHTML = me.birthday; document.getElementById('profileImg').src = uid; document.getElementById('Gender').innerHTML = me.gender; } }) 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> 

6. Copy and paste the data below html in the body section of the html page

     <div style="height: 500px; margin-left: 23px;"> <h1> Facebook Login Authentication Example</h1> <div id="auth-status"> <div id="auth-loggedout"> <div class="fb-login-button" autologoutlink="true" scope="email,user_checkins"> Login with Facebook</div> </div> <div id="auth-loggedin" style="display: none"> Hi, <span id="auth-displayname"></span>(<a href="#" id="auth-logoutlink">logout</a>) <br /> Email: <span id="Email"></span><br/> Ammar Birthday <span id="BD"></span><br/> Gender :<span id="Gender"></span><br/> <br /> Profile Image: <img id="profileImg" /> </div> </div> </div> 

Now start your asp.net page and you will get the necessary information. Here I got the display name, birthday, email address, gender and image.

see the final screenshot and enjoy it in your own way :)

Answer 3

You can see here an open source project that does what you are looking for:

http://www.codeplex.com/site/search?query=facebook%20api&ac=3

Answer 4

You can do this using the Javascript SDK on your web page.

The following solution uses the xocialCore plugin. In fact, you can simply extract the first two functions from this plugin as they provide the necessary functions for this.

https://github.com/xocialhost/jquery.xocialCore.js/blob/master/jquery.xocialCore.js

First you need to create and configure your facebook application. Make sure you fill in the website information with your URL / domain.

On the registration page, make sure you enable jQuery and then the above plugin.

Create a button on your page, for example:

 <button id="fbLoginButton">Login</button> 

and then run the following code:

 $.xcInitFacebook({appId:'yourFBappId',callback:function(){ $('#fbLoginButton').click(function(event){ event.preventDefault(); $.xcFbLogin({permissions:'manage_pages, offline_access, email',callback:function(){ FB.getLoginStatus(function(response) { var fbUrl='https://graph.facebook.com/'+response.authResponse.userID+ '?fields=email,first_name,last_name,picture'+ '&access_token='+response.authResponse.accessToken; $.getJSON(fbUrl,function(data){ //Pass the return data information to your Registration/Login system }); }); } }); }); } }); 

The response from the Facebook server should look something like this:

 { "email": "emailid\u0040domain.com", "first_name": "fName", "last_name": "lName", "id": "12345", "picture": "https://fbcdn-profile-a.akamaihd.net/hprofile-ak-snc4/49860_12345_8441_q.jpg" } 

You will obviously want to do this further when you check to see if the user is already registered and then displays the login button or not, but this should provide you with the requested information about the user.