Can any one tell me how exactly the FB API works.
It looks to be a basic question but I am really confused.
Question:
I have onlogin(). When I click the login button, I am expecting it to call this function.
But in the code I pasted: I see that alert-test is printed first and than the FB.api is called.
So, it looks like onlogin is called first, then the FB API ...is there a way I can call this function only once.
<body>
<div id="fb-root"></div>
<script>
window.fbAsyncInit = function() {
FB.init({appId: 'XXX', status: true, cookie: true, xfbml: true});
};
(function() {
var e = document.createElement('script'); e.async = true;
e.src = document.location.protocol +
'//connect.facebook.net/en_US/all.js';
document.getElementById('fb-root').appendChild(e);
}());
function checkFacebookLogin() {
FB.api('/me', function(response) {
alert("Name: "+ response.name + "\nFirst name: "+ response.first_name + "ID: "+response.id);
});
alert('test');
}
</script>
<p id="fb_login_button_1"><fb:login-button onlogin="checkFacebookLogin();" size="medium" scope="user_about_me">Sign in using Facebook</fb:login-button></p>
</body>v
My main issue is the function should be called only once....but it is getting called twice.
<body>
<div id="fb-root"></div>
<script>
window.fbAsyncInit = function() {
FB.init({appId: 'XXX', status: true, cookie: true, xfbml: true});
};
(function() {
var e = document.createElement('script'); e.async = true;
e.src = document.location.protocol +
'//connect.facebook.net/en_US/all.js';
document.getElementById('fb-root').appendChild(e);
}());
function fetchUserDetail()
{
FB.api('/me', function(response) {
alert("Name: "+ response.name + "\nFirst name: "+ response.first_name + "ID: "+response.id);
});
}
function checkFacebookLogin()
{
FB.getLoginStatus(function(response) {
if (response.status === 'connected') {
fetchUserDetail();
}
else
{
initiateFBLogin();
}
});
}
function initiateFBLogin()
{
FB.login(function(response) {
fetchUserDetail();
});
}
</script>
<input type="button" value="Sign in using Facebook" onclick="checkFacebookLogin();"/>
</body>
Request call to FB API is asynchronous. It means that once the request is sent, the code will not wait for the request to be completed. Because of this you get alert-test before the API Call is returned. All the FB API calls are asynchronous, if you try to make them synchronous then your browser will hang.
Thanks
Kaushik
Related
I have created a one page that contain the Facebook button like if user liked our page redirect to second page I did all things but I need to check users if they already have been liked our page immediately redirect to second page.
<div id="fb-root"></div>
<fb:like href="https://www.facebook.com/example-page/" send="false" width="450" show_faces="false" font=""></fb:like>
java script
<script type="text/javascript">
window.fbAsyncInit = function () {
FB.init({appId: 'appid', status: true, cookie: true, xfbml: true });
FB.Canvas.setSize({ width: 520, height: 1500 });
FB.Event.subscribe('edge.create',
function (response) {
window.location = "http://www.example.net/";
}
);
};
(function () {
var e = document.createElement('script'); e.async = true;
e.src = document.location.protocol +
'//connect.facebook.net/en_US/all.js';
document.getElementById('fb-root').appendChild(e);
}());
</script>
I'm having trouble with the javascript sdk for Facebook. I'm trying to do a simple api call which returns my name, according to the documentation. An alert should popup stating "Your name is ", but I'm getting "Your name is undefined" instead. Am I missing something?
The php SDK is working well, so I know it's not an error regarding app setup. I'm also currently logged into the app.
<div id="fb-root"></div>
<script>
window.fbAsyncInit = function() {
FB.init({
appId: '<app id>',
cookie: true,
xfbml: true,
oauth: true
});
FB.Event.subscribe('auth.login', function(response) {
window.location.reload();
});
FB.Event.subscribe('auth.logout', function(response) {
window.location.reload();
});
FB.api('/me', function(response) {
alert('Your name is ' + response.name);
});
};
(function() {
var e = document.createElement('script'); e.async = true;
e.src = document.location.protocol +
'//connect.facebook.net/en_US/all.js';
document.getElementById('fb-root').appendChild(e);
}());
</script>
I am using Facebook Auth on my local computer and it had been working fine until this morning. I can't figure out why I get an access denied when connecting.
http://facebook.com/en_US/all.js
Here is my script. I have checked it in several browsers.
window.fbAsyncInit = function() {
FB.init({
appId: '". $AppID."',
cookie: true,
xfbml: true,
oauth: true
});
FB.Event.subscribe('auth.login', function(response) {
window.location.reload();
});
FB.Event.subscribe('auth.logout', function(response) {
window.location.reload();
});
};
(function() {
var e = document.createElement('script'); e.async = true;
e.src = document.location.protocol +
'//connect.facebook.net/en_US/all.js';
document.getElementById('fb-root').appendChild(e);
}());
Trying replacing window.loaction.reload() with window.location.reload(true).
If this doesn't fix the problem trying another way like:
window.location.replace(window.location.href)
I was wondering wether it is possible to redirect someone to a different tab url after using a publish to wall popup dialog.
Current publish to wall script.
<script type="text/javascript">
window.fbAsyncInit = function() {
FB.init({appId: APPID,
status: true,
cookie: true,
xfbml: true}); };
(function() {
var e = document.createElement('script');
e.async = true;
e.src = document.location.protocol +
'//connect.facebook.net/en_US/all.js';
document.getElementById('fb-root').appendChild(e);
}());
</script>
<script>
function publish_to_wall(){
FB.ui({
method: 'stream.publish',
display: 'iframe',
name: ('some text ') + (document.getElementById('myText').value) +(' some text'),
caption: 'some caption',
link: 'some url',
picture:'some image url'
});
}
</script>
The redirect must be taken place inside the iframe..so after someone had publish the post to his/her wall people get redicted to a thankyou page.
Something like this?
feedData = {};
feedData.method = 'feed';
feedData.name = "title";
feedData.link = "url";
feedData.picture = "url to picture";
FB.ui(feedData,function(feedResponse) {
if (response && response.post_id) {
alert('Post was published.');
//do redirect
window.location = "url to thank you page"
} else {
alert('Post was not published.');
}
});
i have copied this code from the FB.init documentation:
<script src="http://static.ak.connect.facebook.com/js/api_lib/v0.4/FeatureLoader.js.php/en_US" type="text/javascript"></script>
...
<!-- facebook JS SDK init -->
<div id="fb-root"></div>
<script>
window.fbAsyncInit = function() {
FB.init(
{
appId: '<?= FacebookHelper::FACEBOOK_APP_ID ?>',
status: true,
cookie: true,
xfbml: true
});
};
(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);
}());
</script>
i placed it just before my </body> tag (as they recommend in the documentation), but i am getting this weird error (i can see via firebug):
b is undefined
[Break on this error] if(!window.FB)FB={};FB.forEach=functio...B.TypeLoader.subclass,FB.TypeLoader);
now, at first, i thought this must be a bug with my code, but the more i think about it, the more i remember hearing about some problems between firebug and facebook javascript. is that the problem, or am i forgetting something?
I think it is because you are including the older version of Facebook Connect. You don't need to include it with the newer JS SDK:
<script src="http://static.ak.connect.facebook.com/js/api_lib/v0.4/FeatureLoader.js.php/en_US" type="text/javascript"></script>
Also, Facebook recommends placing the asynchronous loading code right after the opening body tag, such as (but it's your call):
<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
});
};
(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);
}());
</script>
...
...
</body>
Firebug doesn't seem to be the issue here.
I had a similar problem with FB>UI calls for feed dialogues. My page was loaded via ajax and the UI does not poup. I just disabled the FireBug and it started to work amazingly!. Guess the FB is ambiguous between FireBug vs FaceBook for Mozilla.
Thanks all this issue is due to
<form id="fbform"></form>
<div id="fb-root"></div> is not included before script. you guys can try this code as i wrote.
div id="fb-root"></div>
<script>
//initializing API
window.fbAsyncInit = function() {
FB.init({appId: '298295206936650', status: true, cookie: true, xfbml: true});
};
(function() {
var e = document.createElement('script'); e.async = true;
e.src = document.location.protocol +'//connect.facebook.net/en_US/all.js';
document.getElementById('fb-root').appendChild(e);
}());
</script>
<script>
//your fb login function
function fblogin(action) {alert('dd');
if(action == 'undefined'){
var action = 'fb_login';
}
FB.login(function(response) {
if (response.authResponse) {
console.log('Welcome! Fetching your information.... ');
FB.api('/me', function(response) {
var user = response;
//alert(user.birthday)
console.log(response)
//alert(user.id+'---'+user.email);
var picture_fb='https://graph.facebook.com/'+user.id+'/picture?width=100&height=100';
// alert(picture_fb);
if (user.current_location != null) {
var city = user.current_location['city'];
var country = user.current_location['country'];
}else{
var city = '';
var country = '';
}
if(action == 'update_fb_pic'){
var email_user= '<?=$this->session->userdata('user_id');?>';
}else{
if(user.email !='' && user.email !=''){
var email_user= user.email;
}else{
var email_user= '';
}
}
$.ajax({
type: 'POST',
url: "<?php echo site_url()?>front/ajax_fb_login",
data: "action="+action+"&fb_user_id="+user.id+"&username="+user.name+"&username="+user.name+"&first_name="+user.first_name+"&last_name="+user.last_name+"&gender="+user.gender+"&email="+email_user+"&avatar="+picture_fb+"&dob="+user.birthday,
success: function(msg){
//alert(msg);
//window.parent.document.location.reload();
window.location= "<?php echo site_url()?>profile"
//$("#fbform").submit();
}
});
});
} else {
console.log('User cancelled login or did not fully authorize.');
}
}, { scope: 'email,user_birthday,status_update,read_stream,publish_stream'});
}
</script>