facebook Error b is null - facebook

I'm creating a fanpage on facebook, when the page loads I m getting error because of FB.getLoginStatus.
b is null [Break On This Error] FB.provide('',{ui:function(f,b){f=FB.c...onent(FB.UIServer._resultToken));}});
b is null
http://connect.facebook.net/en_US/all.js
Line 22
all.js FB.provide('',{ui:function(f,b){f=FB.copy({}.....
I'm really confused why I'm getting b is null, check my current code.
<!doctype html>
<html xmlns:fb="http://www.facebook.com/2008/fbml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8"/>
<title><?php echo APP_NAME; ?></title>
<link href="css/style.css" rel="stylesheet" type="text/css" />
</head>
<body>
<div id="fb-root"></div>
<script>
window.fbAsyncInit = function() {
FB.init({
appId : 'xxxxxxx',
status : true, // check login status
cookie : true, // enable cookies to allow the server to access the session
xfbml : true
});
//FB.UIServer.setLoadedNode = function (a, b){FB.UIServer._loadedNodes[a.id] = b; }
FB.getLoginStatus(function(response) {
if (!response.session) {
FB.login(friendsGet);
}
else
{
friendsGet(response);
}
});
};
(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);
}());
thanks

I get the error as well and as ElbertF writes, it's because the browser blocks the pop up window.
Only way to get over this is to let the user do an action and then call FB.Login. Let him click something - anything.
Why is facebook even using popups?? Totally old school.
/Rune

Related

Facebook Javascript API SDK and Init method

I use this for start the SDK of API js of Facebook :
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Documento sin título</title>
</head>
<body>
<script type="text/javascript">
window.fbAsyncInit = function() {
FB.init({
appId:'<?php echo $appf['id'];?>',
channelUrl:'<?php echo $appf['url'];?>',
status:true,
cookie:true,
xfbml:true
});
function test() {
alert("okokok");
}
}
</script>
<script>
(function() {
var e = document.createElement('script');
e.type = 'text/javascript';
e.src = document.location.protocol +
'//connect.facebook.net/en_US/all.js';
e.async = true;
document.getElementById('fb-root').appendChild(e);
}());
</script>
Active Alert Test
</body>
</html>
My problem it´s i need insert some functions as login of facebook and if put the code inside of Fb.init , never works as in the example , the functions only works outside of Fb.init
I don´t understand why happend this because some functions as for example :
FB.getLoginStatus(function(response)
Works perfectly inside Fb.init
I like to understand what I did bad for getting this errors because i have a little function for login and inside of Fb.init no works
Scoping, syntax and teh rulez
test() is an illegitimate child of fbAsyncInit() which is a child of the window.
If the idea is to get an alert when clicking an element - if fbAsyncInit() is initialised - you'd be better off testing for the property...
window.foo = function() { var bar = "baz"; };
window.test = function() {
if ( typeof foo === "function" ) {
alert( "whoot!" );
} else {
var oh_nose = true;
}
}
...or similar.
Then call test() - which is a child of the window - when your clicky element gets poked.
Notice that:
Calling alert() - which is a child of the window - works the same way. It can be argued (and often is) that the correct way to call alert() is by calling window.alert( "whatever" );.
An aside
Consider using HTML5 via <!DOCTYPE html>
See
An answer on another question for some more details.

Facebook post to user's wall

Any guide of how to make something in which when a user logs into my site using Facebook, it automatically can post a status using their Facebook account saying something like "John just joined mysite.com" so all their friends would see. Anything like that?
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>Facebook post</title>
</head>
<body onload="publishWallPost('{{ page.slug }}')">
<script>
window.fbAsyncInit = function() {
FB.init({appId: 'Your Super Cool App ID', 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 publishWallPost(slug) {
var attachment = {'name':'My Super Cool Website','description':'This is a test of the Facebook Broadcast System. If this was real, you would be reading something useful.','media':[{'type':'image','src':'http://MySuperCoolWebsite.com/images/facebook_image.png','href':'http://www.MySuperCoolWebsite.com/' + slug + '/'}]};
FB.ui({
method: 'stream.publish',
message: 'I just found this Super Cool Website!',
attachment: attachment,
user_message_prompt: 'post this to your wall?'
});
}
//-->
</script>
</body>
</html>

Facebook Reveal Without PHP

I found some code on here for NON-PHP Revealing HTML when the Like button is clicked however, not working for me. The code is as follows:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en">
<head>
<link rel="stylesheet" type="text/css" href="style.css" />
<style type="text/css">
body {
width:520px;
margin:0; padding:0; border:0;
font-family: verdana;
background:url(repeat.png) repeat;
margin-bottom:10px;
}
p, h1 {width:450px; margin-left:50px; color:#FFF;}
p {font-size:11px;}
#container_notlike, #container_like {
display:none
}
</style>
<script type="text/javascript" src="/js/jquery-1.6.2.min.js"></script>
<script type="text/javascript">
$(document).ready(function () {
FB.login(function (response) {
if (response.session) {
var user_id = response.session.uid;
var page_id = "167544069999229";
var fql_query = "SELECT uid FROM page_fan WHERE page_id = " + page_id + "and uid=" + user_id;
var the_query = FB.Data.query(fql_query);
the_query.wait(function (rows) {
if (rows.length == 1 && rows[0].uid == user_id) {
$("#container_like").show();
//here you could also do some ajax and get the content for a "liker" instead of simply showing a hidden div in the page.
} else {
$("#container_notlike").show();
//and here you could get the content for a non liker in ajax...
}
});
} else {
// user is not logged in
}
});
});
</script>
<meta http-equiv="Content-Type" content="text/html;
charset=iso-8859-1" />
</head>
<body>
<div id="fb-root"></div>
<script src="http://connect.facebook.net/en_US/all.js"></script>
<script>
FB.init({
appId: '270349276366373',
status: true,
cookie: true,
xfbml: true
});
</script>
<div id="container_notlike">
YOU DONT LIKE
</div>
<div id="container_like">
YOU LIKE
</div>
</body>
</html>
I have changed the APPID and PageID as necessary but not working and it keeps trying to bring up a pop up window.
It will eventually contain dynamic content in vb.net aspx file, so PHP isnt available to me.
Any ideas, can it be done server side through a SOAP or REST request?
you have to wait until the script is loaded and the FB va is init, try this flow...
if you have problem with login
<body>
<div id="fb-root"></div>
<script src="http://connect.facebook.net/en_US/all.js"></script>
<script>
// fired when script is loaded
window.fbAsyncInit = function() {
FB.init({
appId : '', // App ID
channelUrl : '', // Channel File
status : true, // check login status
cookie : true, // enable cookies to allow the server to access the session
xfbml : true // parse XFBML
});
//do some stuff here (Login)
};
// Load the SDK Asynchronously
(function(d){
var js;
var id = 'facebook-jssdk'
var 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));
</script>

Facebook as tab scroll bars -- still no luck

I am really struggling with how to get the scroll bars off of my tab. I am simply trying to create a Facebook tab for a company Facebook page and I have tried everything to get the vertical scroll to go away. Here is the code I am working with
<head>
<meta content="text/html; charset=utf-8" http-equiv="Content-Type" />
<link href="facebookstyles.css" rel="stylesheet" type="text/css" />
<script type="text/javascript" src="scripts/jquery.innerfade.js"></script>
<fb:share-button type="icon_link" class="url"></fb:share-button>
</head>
<body>
<table>
CONTENT
</table>
<p> </p>
<p> </p><div id="fb-root"></div>
<script>
window.fbAsyncInit = function() {
FB.init({appId: '{{277868305571181}}', status: true, cookie: true,xfbml: true});
window.setTimeout(function() {
FB.Canvas.setSize({height:1500});
}, 250);
};
(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>
</body>
</html>
You may need to enable OAuth2 in your application settings.
<div id="fb-root"></div>
<script>
window.fbAsyncInit = function() {
FB.init({
appId: '277868305571181',
status: true,
cookie: true,
xfbml: true,
oauth : true // enable OAuth 2.0
});
FB.Canvas.setAutoGrow();
};
(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>

FB.Canvas.setSize simply fails after a refresh? (facebook iframe application)

I've created a facebook connect application, iframe. I'm using it under apps.facebook.com/app-name.
It seems that after a refresh, the setSize() method simply fails. sometimes works, sometimes doesn't... (under latest Firefox and IE) is there a solution for that? would you recommend using the old API instead?
testcase:
<!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>test</title>
<meta name="description" content="test">
</head>
<body>
<div id="fb-root"></div>
<script type="text/javascript">
window.fbAsyncInit = function() {
FB.init({appId: 'XXXXXXXXX', status: true, cookie: true, xfbml: true});
FB.Canvas.setSize({ width:760,height:3000 });
};
(function() {
var e = document.createElement('script');
e.type = 'text/javascript';
e.src = document.location.protocol + '//connect.facebook.net/en_US/all.js';
e.async = true;
document.getElementById('fb-root').appendChild(e);
}());
</script>
<div style="height:2000px;background:blue;width:760px;">
</div>
</body>
</html>
if for some reason window.name is set the FB.setAutoSize wont work, http://bugs.developers.facebook.net/show_bug.cgi?id=19720 in my case its connected somehow to jquery $.data
window.fbAsyncInit=function(){
FB.Canvas.setSize = function(b) {
if (typeof b!="object")
b={};
b=b||{};
if (b.width==null||b.height==null)
b=FB.copy(b,FB.Canvas._computeContentSize());
b=FB.copy(b,{frame:'iframe_canvas'});
if (FB.Canvas._lastSize[b.frame]) {
var a=FB.Canvas._lastSize[b.frame].height
if(FB.Canvas._lastSize[b.frame].width==b.width&&(b.height<=a&& (Math.abs(a-b.height)<=16)))
return false;
}
FB.Canvas._lastSize[b.frame]=b;FB.Arbiter.inform('setSize',b);
return true;
}
FB.init({
appId:"<?php echo FB_APP_ID; ?>",
status:true,
cookie:true,
xfbml:true
});
FB.Canvas.setAutoResize()
};