How do we create a link to initiate the FB connect process WITHOUT using one of their built in button forms <fb:login-button ></fb:login-button>
Just add an onclick event to any of your custom buttons and have it call the FB.login event in their javascript sdk.
Full example:
<!DOCTYPE html>
<html>
<body>
<div id="fb-root"></div>
Custom Login Button
<script src="http://connect.facebook.net/en_US/all.js"></script>
<script>
FB.init({ appId: '**yourAppId**', status: true, cookie: true, xfbml : true });
function doLogin() {
FB.login(function(response) {
if (response.session) {
FB.api('/me', function(response) {
alert('Welcome ' + response.name);
alert('Full details: ' + JSON.stringify(response));
}
);
}
} , {perms:''});
}
</script>
</body>
</html>
Related
the facebook javascript sdk login dialog just flashes (i.e shows then hides) if the user is already logged into FB. Is there anyway to stop this from happening or is my code below not quite right?
<div id="fb-root">
</div>
<script type="text/javascript" src="https://connect.facebook.net/en_US/all.js"></script>
<script type="text/javascript">
window.fbAsyncInit = function () {
FB.init({ appId: 'XXXXXXX', status: true, cookie: true, xfbml: true });
};
function connectToFB() {
FB.login(function (r) { alert('connected'); }, { scope: 'user_photos' });
}
</script>
<input type="button" value="connect" onclick="connectToFB();" />
You should check if the user is logged in with getLoginStatus() first. Here is the official Facebook Documentatin: FB.getLoginStatus
i ma using Facebook JavaScript SDK for my FB iframe app. i wnat to get teh user email id in login state
here is my code......
<html>
<head>
<meta http-equiv="content-type" content="text/html; charset=UTF-8">
<title>Mettter</title>
</head>
<script src="http://connect.facebook.net/en_US/all.js"></script>
<div id="fb-root"></div>
<script>
FB.init({appId:'1*********', xfbml: true, cookie: true, oauth: true, fbconnect: false}); FB.getLoginStatus(function(response) {
if (response.authResponse) {
// logged in and connected user, someone you know
FB.api('/me', function(resp) {
alert('Your name is... ' + resp.name);
alert('Your email is.... ' + resp.email);
});
} else {
// no user session available, someone you dont know
alert("i dont know ");
FB.api('/me', function(res) {
alert('Your name is ' + res.name);
alert('Your email is ' + res.email);
});
}
});
</script>
<body>
<h1>Welcome</h1>
</body>
</html>
now when i hit my app URL.. i see a log in to app window i click log in then i see allow window asking for publish streams and when i click allow the the else alert is fired and conatains undefined instead of name and email and the URL contains this message
http://apps.facebook.com/palmchipprojecta/?error_reason=user_denied&error=access_denied&error_description=The+user+denied+your+request.#_=_
i am not getting whats wrong in it??
I'm new to the facebook api, but I have this:
<html>
<head>
<title>My Facebook Login Page</title>
</head>
<body>
<div id="fb-root"></div>
<script src="http://connect.facebook.net/en_US/all.js"></script>
<script>
FB.init({
appId:'my_app_id', cookie:true,
status:true, xfbml:true
});
</script>
<fb:login-button perms="email">Login</fb:login-button>
</body>
I would like to know, when a user accepts my perms or when they return to my site, how do I get that users email adderss?
this will help :
FB.api('/me', function(user) {
if(user != null){
document.write(user.email);
}
})
call this function after user gives you permission
Check out the javascript sdk documentation, they have a similar example of doing this. Try something like:
FB.api(
{
method: 'fql.query',
query: 'SELECT email FROM user WHERE uid='+FB.getSession().uid
},
function(response) {
alert('Email is ' +response[0].email);
}
);
I'm using Facebook PHP SDK v2.1.2 and JS SDK on my page. I've put a <fb:login-button autologoutlink="true"></fb:login-button>
[...]
<head>
<script type="text/javascript" src="http://connect.facebook.net/pt_BR/all.js#xfbml=1"></script>
<script type="text/javascript">
FB.init({
appId: '{$appId}',
cookie: true,
status: true,
xfbml: true
});
FB.Event.subscribe('auth.logout', function (response) {
alert('Bye!');
window.location.refresh();
});
</script>
</head>
<body>
<div id="fb-root"></div>
<fb:login-button autologoutlink="true"></fb:login-button>
[...]
When I'm logged I can see the logout button, but when I click on it nothing happens. Am I missing something? I use the <fb:login-button> on logon and it works like a charm with PHP SDK!
Thank you in advance.
Instead of
window.location.refresh();
Try
window.location.reload();
I am trying to have a connect button on my site. Once the user has clicked the facebook login button, the pop up will ask the user to enter the authentication detail and the parent window will either redirect or refresh the page and the login button became a logout button.
My problem is when a user clicked the connect button from the popup, the popup page will redirect to my canvas page rather than closed the popup instead.
Many people have posted this issue, if you have done everything else right, the reason for this is xd_receiver file was not read by the fb.
You need to make sure that where your fb connect button is, you specify the correct path to xd_receiver.html file somewhere on bottom of that page. Something like below:
<script type="text/javascript">
FB.init("your api key here", "xd_receiver.htm");
</script>
It is even better and easier to put the xd_receiver file on your site's root folder and specify it with full domain url like this:
<script type="text/javascript">
FB.init("your api key here", "http://www.yoursite.com/xd_receiver.htm");
</script>
Here's a sample of facebook connect, login and logout, works very well,
Also make sure you add your site url under your app settings -> Website - > Site URL:
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml" xmlns:fb="http://www.facebook.com/2008/fbml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8"/>
<title>Facebook Connect Sample</title>
</head>
<body>
<div id="fb-root"></div>
<script>
window.fbAsyncInit = function() {
FB.init({
appId : 'YOUR APP ID',
status : true, // check login status
cookie : true, // enable cookies to allow the server to access the session
xfbml : true // parse XFBML
});
/* All the events registered */
FB.Event.subscribe('auth.login', function(response) {
// do something on login
login();
});
FB.Event.subscribe('auth.logout', function(response) {
// do something on logout
logout();
});
FB.getLoginStatus(function(response) {
if (response.session) {
// logged in and connected user, someone you know
login();
}
});
};
/* Loading the JS SDK Asynchronously - Refer: https://developers.facebook.com/docs/reference/javascript/ */
(function() {
var e = document.createElement('script');
e.src = document.location.protocol + '//connect.facebook.net/en_US/all.js';
e.async = true;
document.getElementById('fb-root').appendChild(e);
}());
function login(){
window.location = "http://google.com"; // Redirect to Another Page.
/* Show User's Name
FB.api('/me', function(response) {
document.getElementById('login').style.display = "block";
document.getElementById('login').innerHTML = response.name + " succsessfully logged in!";
});
*/
}
function logout(){
document.getElementById('login').style.display = "none";
}
</script>
<p><fb:login-button autologoutlink="true"></fb:login-button></p>
<div id="login" style ="display:none"></div>
</body>
</html>