I've been trying to tackle this since last week and for the life of me I cannot seem to get this working on safari, all other browsers render the popup except Safari.
It seems straight forward enough, load up the javascript-sdk asynchronously, initiate it, and call FB.ui with method 'stream.publish'. The thing is I know this code should work in safari cause the example here does http://fbrell.com/fb.ui/stream.share.
I'm using this P3P header which we use that fixes a problem with IE7:
Response.AddHeader("P3P", "CP=\"NON DSP COR DEVa PSAa IVAo CONo OUR IND UNI PUR NAV DEM LOC\", " + "policyref=\"http://sweepstakes.mars.com/w3c/p3p.xml\"");
I'm hoping someone could offer the magic tip that's gonna get this working. Here's my code:
<!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" xmlns:og="http://opengraphprotocol.org/schema/" xmlns:fb="http://www.facebook.com/2008/fbml">
<head id="Head1" runat="server">
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>test</title>
</head>
<body>
<div id="fb-root">
</div>
<script>
window.fbAsyncInit = function (){
FB.init({ appId: '<%= Common.appID %>', status: true, cookie: true,
xfbml: true
});
var publish = {
method: 'stream.publish',
message: 'test',
display: 'dialog'
};
FB.ui(publish);
};
(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>
After many tests and frustrations. A colleague pointed out that 'feed' is the new way of doing 'stream.publish'. This fixed the issue.
Edit: Outdated answer.
Related
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.
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>
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
If I only run one of them, then it can show up properly.
If I run both of them at same time, the code who come first will show, the one who come up at bottom will not show.
I believe there's some conflict.
Anyone facing this issue?
<html doctype="XHTML 1.0 Transitional" xmlns:fb="http://www.facebook.com/2008/fbml">
<head></head>
<body>
<div class="fbLikeButton">
<fb:like show_faces="false" width="300"></fb:like>
<div id="fb-root"></div>
<script>
window.fbAsyncInit = function() {
FB.init({appId: 'XXXXXXXX', status: true, cookie: true,
xfbml: true});
};
(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>
<br>
</div>
<!-- facebook code -->
<div align="center">
<script type="text/javascript" src="http://static.ak.connect.facebook.com/js/api_lib/v0.4/FeatureLoader.js.php/en_US"></script>
<script type="text/javascript">FB.init("de15667c632963d186082c258e3cc970");</script>
<fb:fan profile_id="XXXXXXXXXX" stream="0" connections="6" width="155" height="350"></fb:fan>
</div>
</body>
</html>
ok, it works now.
I believe it is javascript code redundancy.
Just need to remove one of the javascript reference.
I removed <script type="text/javascript" src="http://static.ak.connect.facebook.com/js/api_lib/v0.4/FeatureLoader.js.php/en_US"></script>
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()
};