Introduction:
In this article I will explain how to access or get Username, email, profile image of facebook logged in user using asp.net.
In this article I will explain how to access or get Username, email, profile image of facebook logged in user using asp.net.
Description:
In previous post I explained how to integrate facebook login to asp.net website. In that I explained clearly how to create app in facebook and integrate facebook login in website. After create and integrate facebook login I got requirement like get facebook logged in user details those are name, email, profile image etc.
To implement this one first create app and integrate facebook login in website based on previous post. Once set up is completed check your aspx page and observe script in your page in that we have function
In previous post I explained how to integrate facebook login to asp.net website. In that I explained clearly how to create app in facebook and integrate facebook login in website. After create and integrate facebook login I got requirement like get facebook logged in user details those are name, email, profile image etc.
To implement this one first create app and integrate facebook login in website based on previous post. Once set up is completed check your aspx page and observe script in your page in that we have function
FB.api('/me', function(me)
{
if (me.name) {
document.getElementById('auth-displayname').innerHTML = me.name;
}
})
|
FB.api function is used to
get basic details (Name, profile image, gender, user id, friends list, any information
we shared publically) of logged in user from facebook.
If you need access to more information,
such as the user's email address, etc. you must request permissions for this
information. For that we need to add permission to
scope attribute of the Login Button and our FB.api function will be like this
var uid = "http://graph.facebook.com/"
+ response.authResponse.userID + "/picture";
FB.api('/me',
function(me) {
document.getElementById('auth-displayname').innerHTML = me.name;
document.getElementById('Email').innerHTML = me.email;
document.getElementById('profileImg').src = uid;
})
|
By using above method we can get name, email,
profile image for that Our scope
attribute of login button will be like this
<div class="fb-login-button" autologoutlink="true"
scope="email,user_checkins">Login
with Facebook</div>
</div>
|
Here I am getting only user email address
if you want more information then you need to get permission for other objects
for that check this link scope permission reference.
After make all our code modifications that
would be like this
<html>
<head>
<title>Facebook Get Logged in User Details UserName,Email,Profile
Image</title>
<script type="text/javascript" src="http://code.jquery.com/jquery-latest.js"></script>
</head>
<body>
<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: '198191300293654',
// 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
var uid = "http://graph.facebook.com/"
+ response.authResponse.userID + "/picture";
FB.api('/me',
function(me) {
document.getElementById('auth-displayname').innerHTML = me.name;
document.getElementById('Email').innerHTML = me.email;
document.getElementById('profileImg').src = uid;
})
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>
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">
Name: <b><span id="auth-displayname"></span></b>(<a href="#" id="auth-logoutlink">logout</a>)<br />
Email: <b><span id="Email"></span></b><br />
Profile Image: <img id="profileImg" />
</div>
</div>
</body>
</html>
|
Now run your application and check the
output that would be like this
Demo
 |
|
If you enjoyed this post, please support the blog below. It's FREE! Get the latest Asp.net, C#.net, VB.NET, jQuery, Plugins & Code Snippets for FREE by subscribing to our Facebook, Twitter, RSS feed, or by email. |
|||
Subscribe by RSS
Subscribe by Email
|
|||
65 comments :
This is really good, thanks helped me lot.
can we put user information in my site data base, to access other login protected pages from my site.
This is really a nice article.
How can we get user information like mobile or phone number and some other basic information of the user?
Please help me! I required this in my application..
@Mahesh
if you observe above post i explained clearly if you want to get more objects from facebook use this link
https://developers.facebook.com/docs/authentication/permissions/
Your first version with log in/ log out reloading worked great right away. But this version doesn't work at all for me. The div class="fb-login-button" autologoutlink="true" scope="email,user_checkins" throws warnings as autologoutlink is not a property of a div. And it doesn't work because it's not a clickable element. What's missing?
@Pat Patterson...
autologoutlink is not a property of a div it is id of hyper link. Please check the code and implement in your application. For your information it's latest code which is working perfectly.
hi suresh can you pls tell how to import contacts from facebook
Really supeb post, i had wasted alot of my time here and there and nothing exactly worked. I got the post at 9 page of google result which just worked magically by simply changing the app_id and no alot of efforts. Once thanks alot.....
Its working fine for me, but I want to get date of birth and city of user. So please tell me how it is possible
hello thanks this is really nice tutorial....
i just want to ask
how could we get larger image from Facebook Profile of the user...
hi
this method working good for my website,and also not working for (internet explorer-7) plz help me...
hi,
this is really good one,small help for me this concept not displayed(user details) in (IE-7). please tell an solutions for me...
Thanks,
rajesh kumar.n
This is really good, thanks helped me lot.
i want take emailid in text box,if it is possible then please help me
Sir how to logout on othe page after Login on login pgae
Sir how Asp.net get Twitter logged in user details(Username,email,profile image) Plz Plz Plz Plz Plz Plz Tell me
@Mayank Sharma...
Check this article tog et twitter loggied in user details
http://www.aspdotnet-suresh.com/2012/05/add-twitter-login-authentication-to.html
FB.api('/me', function (me) {
document.getElementById('Email').innerHTML = me.email;
document.getElementById('auth-displayname').innerHTML = me.first_name;
document.getElementById('last-name').innerHTML = me.last_name;
document.getElementById('ID').innerHTML = me.id;
document.getElementById('profileImg').src = uid;
window.location = 'Home.aspx';
});
sir in this Code i redirect to Home Pge and here i want to be logout button.if i click it then i want to be redirect to login page.
Plz suggest me as soon as possible.. Thnx
Sir how can i Post the status from my ASP project to the Facebook and after post how it will redirect to my Project..
Thnx
Sir how can i save fb detail in database. when i click on button click event in we get a null value, means hw we get all detail on server side.
thanx..
sir plz tell me ho can i sabe fb detail in database..?
sir i got your twitter(whole appn with code) integration and now i am integrating facebook please can u send me whole appn like twitter as soon as possible.
neeraj
Hello sir, can you put the code for download ?i am not getting the my names and profile images ,i didn't placed any channel files and is there any mandatory thing with channel ?
Sir, Though the tutorial works perfect when i login for the first time and giving app id , but when i am in debug mode and running the website next time without logging out, it shows a javascript error "Object doesn't support this property or method" below the head section. Am i doing something wrong??
Asp.net integrate Facebook login authentication to website
How to pass the name, gender, birthday and email to server side?
how to save the name, gender, birthday and email into sql database?
hello sureshbhai..i done login..but now i want to save user data in our database when he/she login ..plz help..
hello sir...
I have getting some problem to access this code. when I run this code to log in throw Facebook if I enter my Facebook id & password it fetch my name, email id which I need, but the problem is when I tried to log in throw another Facebook ID & password its not working & shows an error message. As I think though I am the admin of my app its shows my data properly but in case of others its not working...
Please help me out
Hello sir,
Can you please provide me the code to get the friends list and friends of friends list in this way. I have take the authentication access token for taking the friend of friends list..
hello,
This is very nice. helped me a lot.
but i am facing one problem. The code in the script is running on page load. means if i am already logged in with Facebook account and then comes to my page in which i write this code then it automatically display my information.
I want it should display my information after i click on login with Facebook button.??
plz help me in this
once it accessed to facebook account..emaild and picture is not displaying...
once it accessed to facebook account..emaild and picture is not displaying..
Hi , This one is good post but here am getting a problem of accessing emailid and picture details in my page once fb account is accessed ,can u pls help me on this
Hi Suresh it is a very good post helped me a lot ..Thnx...one more thing ,It Worked when i give my local host as URL and Canvas URL ...
Hi Suresh...I wanna hug you man..!
This post saved me a lot. Finally I did it for my website.
Only thing now I wanted to know is how to access phone no. of User?
Please reply as soon as possible.
hi suresh, can you please share the source code
this code is working but not showing anything after login command. .. what should I do??
i wanna save those user details in my database ...pls help me
how to get all this details at server side
plz reply
is it possible to get all the friends email ids ..
Couldn't get the value of username and email id
in the page load in .cs page..is there any solution?
Facebook login logout work for the single user which user create api inside facebook but It's not work for other user they have not any API id ?So kinldy reply for this issue,I am new to develop sharing data in facebook with login and logout features.
Hi suresh,
Your post is very useful for me. But when i login with faceBook it does not dispaly the name and profile image.
It displayed:
Facebook Login Authentication Example
"login with facebook"
please help me.........
How to get page name which is created by user in facebook account to asp.net website
Hi Suresh,
your post is well and good. but i have a problem to display my facebook account. while i execute this code i have an issue like 'Closed' is null or not an object.This error raise in javascript.
how can i fix it?can you give some suggestion.please urgent..This is my mailid : psathya@topazts.com
Hi Suresh,
To redirect user after logged in Im using the below function, issue is, this is not redirecting me to my desired page. Please help with this, thanks.
Fb.Event.subscribe('auth.login', function () {
window.location = 'http://google.com';
});
this is good
This works for me in FF & Chrome, but in IE it does not display anything, is there any trick?
why this coding is not working
window.fbAsyncInit = function() {
FB.init({
in this section
Sir your post is to good and working on local server.when i was deploy it on server ,facebook login is working but not getting value on our own page ,alert are not working and i want to redirect to other page but not working..pls help i spend last 2 days to solve this problem pls sir or any buddy help me....
thanks
Sir give me link of google plus login button to our website with getting all user details..
thanks
This all worked great. But one thing I'm struggling with; how do I pass the email address of user id to the page's VB.Net? I need to run SQL queries on a database using the facebook userid displayed as the WHERE predicate. Any advice would be greatly appreciated.
where exactly the permission in this code has to be set...
i broke my head setting the permissions but nothing works
hi..sir, i want to set the city of user,than what is code for this...please send me code for this.
sir,it is working fine for only app_id user.BUT didn't get the other accounts details.Could please tell me solution ASAP.
Hi, Ruggers here. This is a nice article which you have explained. I've implemented in my project. :) Could you please let me know, is there any way to avoid the "Login" button click and show the login window in the screen after the page load itself inside an iframe or something like that?
simply awesome...
Hello sir,
I'm unable to get user data in code file, as i want to add some code on user login.
sir please tell me how can I save fb detail in my database..?
hi suresh
Still I can,t get user mobile number with using fb.api.I had search on website i got detail is permission is not allowed to get mobile number and address.Please give instruction to me to get mobile number
Sir your post is to good and working on local server.when i was deploy it on server ,facebook login is working but not getting value on our own page ,alert are not working and i want to redirect to other page but not working..pls help i spend last 2 days to solve this problem pls sir or any buddy help me....
sir
i am not getting email please help me
hello sir, i can't getting email id
please give me a demo of c# asp dot net code of how to retrieve facebook friendlist of facebook logged user
Hi , I followed your code its working fine, can you guide me to retrieve facebook login user details in code behind
it is not fetching email why?
Note: Only a member of this blog may post a comment.