I'm trying to get user pages:
<?php
try {
$pages = $facebook->api('/me/accounts?fields=id,name');
if (isset($pages['data'])) {
$this->assign('pages', $pages['data']);
$this->pages = $pages['data'];
}
} catch (\FacebookApiException $e) {
$loginUrl = $facebook->getLoginUrl(
array(
'redirect_uri' => $this->container->getParameter('home_url'),
'scope' => 'email,manage_pages'
)
);
echo '<script type="text/javascript">top.location.href = "'.$loginUrl.'";</script>';
exit;
}
but I jump into endless redirect loop. After some research I found out that PHP SDK get's an error from API in getAccessTokenFromCode method. $access_token_response variable is:
{"error":{"message":"This authorization code has expired.","type":"OAuthException","code":100}}
PHP SDK takes code value from COOKIE. The problem is that fbsr_{app_id} is not flushed and it still contains the same code. And that's the reason for endless loop.
What can I do to overcome this problem. I was thinking about deleting fbsr_{app_id} cookie but it looks weird. Why does SDK not handle this for me?
If you are using PHP 5.4, I ran into this issue too. I wrote up a tutorial on how to fix the issue. The reason was the PHP SDK wasn't picking up the code correctly.
You could also try to destroy the session (session_destroy() or the Framework equivalent) or manually clear the cookies (setcookie ("cookie_name", "", time() - 3600);) if a exception is received.
EDIT:
Make sure the App ID and App Secret in the app are correct too. An incorrect app secret is sometimes the issue as it's used to decode the signed_request.
Also, if the problem is specific to IE, try adding the following header to your code:
header('P3P:CP="IDC DSP COR ADM DEVi TAIi PSA PSD IVAi IVDi CONi HIS OUR IND CNT');
IE's security settings sometimes prevent cookies from setting in iframes. The above header should help.
OK, I think I found workaround. I'm using both PHP SDK and JS SDK. I used following code for redirection:
echo '<script type="text/javascript">top.location.href = "'.$loginUrl.'";</script>';
exit;
But I added JS SDK to it and problem does not occur anymore:
echo "
<div id=\"fb-root\"></div>
<script type=\"text/javascript\">
window.fbAsyncInit = function() {
FB.init({appId: ".$app_id.", status: true, cookie: true, xfbml: true, oauth: true});
FB.getLoginStatus(function(response) {
top.location.href = '".$loginUrl."';
});
};
(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>
";
exit;
I'm not sure if it's not a bug of JS SDK/PHP SDK.
Related
I am having a hybrid mobile application(should work in android and ios). In which I need to post on facebook wall from my application. Please note its a hybrib app, so I am not supposed to use any java or c code.
I tried the following method , its working in simulator , but not in actual device. Please help me.
<script>
window.fbAsyncInit = function() {
FB.init({
appId : ' my appID',
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>
<script type="text/javascript">
$(document).ready(function(){
$('#share_button').live('click', function(e){
e.preventDefault();
FB.ui(
{
method: 'feed',
name: 'HyperArts Blog',
link: 'http://hyperarts.com/blog',
picture: 'http://www.hyperarts.com/_img/TabPress-LOGO-Home.png',
caption: 'I love HyperArts tutorials',
description: 'The HyperArts Blog provides tutorials for all things Facebook',
message: ''
});
});
});
</script>
Thanks
I ran into this. your:
document.location.protocol
which is suppose to pull in the FB SDK is actually "file:///" and thats what gets fed into the url for that FB JS library.
Manually specify http:// or https://
This didnt work for me either on safari webView on IOS so i had to hit the endpoints manually using AJAX.
The code below has been used for several month successfully. But recently, it stopped working. The objective is to pull the latest feed from a facebook page. The response is now "An access token is required to request this resource." But reading the JS SDK docs never suggest anything more than an app ID for this method. What is the real error here?
<script type="text/javascript">
window.fbAsyncInit = function() {
FB.init({appId: '<?php echo $this->appId; ?>', status: true, cookie: true, xfbml: true});
FB.api('/<?php echo $this->appId; ?>/feed', {'limit': <?php echo (int)$this->feedLimit; ?>}, function(response) {
if(response.data[0]) {
jQuery('.facebook .comment p a').append(response.data[0].message);
}
});
};
(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);
}());
Ah, that should work (if your app ID is indeed correct): did the app ID somehow change to a user ID in the recent past?
EDIT: ah, must be a recent change in the platform. I'm guessing accessing app feeds now need a token. See http://developers.facebook.com/blog/post/510/ for details.
I've developed a simple website using facebook connect, and it has been working fine for the last month or so. Underneath the fb:login-button code is a fb:facepile. It has worked as expected until today, when instead of showing friend's pictures it displays the facebook homepage. Here is a screenshot of the problem http://i.stack.imgur.com/nZsbq.png
Here is the relevant code. It worked at one time, so I'm really confused what happened to cause this weird error. Any help would be greatly appreciated.
<div id="fb-root"></div>
<script type="text/javascript">
window.fbAsyncInit = function() {
FB.init({appId: '<?php echo $appkey; ?>', status: true, cookie: true, xfbml: true});
/* All the events registered */
FB.Event.subscribe('auth.login', function(response) {
// do something with response
login();
});
FB.Event.subscribe('auth.logout', function(response) {
// do something with response
logout();
});
};
(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);
}());
function login(){
document.location.href = "<?php echo $base_url.'/facebook/'; ?>";
}
function logout(){
document.location.href = "<?php echo $base_url.'/logout/'; ?>";
}
</script>
I cannot copy the two XFBML tags that follow the javascript. They are fb:login-button and fb:facepile
It is a reported bug but it seems that nobody at Facebook care about it. Very strange and disapointing for such big web company.
http://forum.developers.facebook.net/viewtopic.php?id=90734
You can report this bug by upvoting at the follwoing webpage :
http://bugs.developers.facebook.net/show_bug.cgi?id=15490
It looks like <fb:facepile></fb:facepile> is finally working again. The bug was marked as resolved on the Facebook bugtracker and is currently working as expected on my development server.
I am using the JS SDK for Facebook based on the NEW GraphAPI for Auth/Login.
Has anyone had this issue when logging in after FB.login() was called via the JS SDK?
The problem: after I initialize by calling FB.Init() asynchronously (because this all wrapped in a window.fbAsyncInit function) the login pops up; I log in but then that pop-up refreshes to show a white page and the pop-up stays open and does not close...why? I am waiting to check response.session in the FB.login() callback but it seems as though I never get it back because this pop-up seems to just stick there and the process appears to just halt after you're logged in and I just figured this pop-up would just close and return me the response.session in the callback automatically. Why would that pop-up not go away?
I copied the url from the pop-up after I'm logged in and showing white the following url so it looks like the response is there but then why isn't that pop-up window closing so my callback can handle the response??
http://static.ak.fbcdn.net/connect/xd_proxy.php#?=&cb=f18fe0b7c66da54&origin=http%3A%2F%2Flocalhost%2Ff3745f32ed63a7a&relation=opener&transport=postmessage&frame=f18adb488566372&result=user_photos&session={%22session_key%22%3A%222.vH4SVCisnh8HJWjEI1Vy_Q__.3600.1280106000-100001379631246%22%2C%22uid%22%3A%22100001379631246%22%2C%22expires%22%3A1280106000%2C%22secret%22%3A%22TH45WFg8I_5r_cOoVIujjg__%22%2C%22access_token%22%3A%22132444323462464|2.vH4SVCisnh8HJWjEI1Vy_Q__.3600.1280106000-100001379631246|q123iPQcKY45xWXtOZ2ebOOZTQQ.%22%2C%22sig%22%3A%22a75e85af2354292bfdcf90b9d319ebf7%22}
I did notice that when FB.login() is called and the login pop-up comes up, I see this error in FireBug talking about how it doesn't like the fact that I'm testing over localhost or something I guess:
uncaught exception: [Exception... "Component returned failure code: 0x80004005 (NS_ERROR_FAILURE) [nsIDOMLocation.host]" nsresult: "0x80004005 (NS_ERROR_FAILURE)" location: "JS frame :: chrome://smarterwiki/content/smarterwiki.js :: anonymous :: line 1225" data: no]
that error bothers me...I need to figure out why it's coming up and I bet you I'm not the only one who has seen this when testing locally. I see no info though on troubleshooting this on the net anywhere either on the Facebook forums or elsewhere. I see others have had this issue but no resolution.
So when you implemented yours, did your facebook pop-up just close after the user is logged in or did you need to do something special to finish this process?
Also, I notice if I manually close that pop-up then go to check if that cookie was generated to contain my session, it's not (the fbs_[yourappid] cookie). So it looks like something ends prematurely here. I've got in my init cookie: true so I wonder if this problem were the pop-up dialog is not closing is related to the cookie also not being created client-side on my test PC.
This problem appeared out of nowhere for my site, when facebook made a recent change to its "all.js".
In an earlier version of their javascript I had a problem specific to IE, and I copied this little snippet of code from someone's post on the internet. It seemed cryptic, but solved the problem at the time:
// http://developers.facebook.com/bugs/204792232920393
// Hack to fix http://bugs.developers.facebook.net/show_bug.cgi?id=20168 for IE7/8/9.
FB.UIServer.setLoadedNode = function (a, b) { FB.UIServer._loadedNodes[a.id] = b; };
FB.UIServer.setActiveNode = function(a, b) { FB.UIServer._active[a.id]=b; };
It turns out those lines were causing this problem for me. I removed them, and the problem went away. The original bug specific to IE has also been fixed, I believe, in the most recent "all.js".
I don't know what your code is, but my problem was I forget to add
<div id="fb-root"></div>. My code :
<div id="fb-root"></div>
<script src="http://static.ak.fbcdn.net/connect/en_US/core.js"></script>
<script>
FB.init({ apiKey: 'app key'});
</script>
<div class="fbloginbutton" id="fb-login" onclick="Login();">
<span id="fb_login_text" >Login with Facebook</span>
</div>
<asp:Label ID="errMsg" runat="server"></asp:Label>
<script type="text/javascript">
function Login() {
FB.login(function(response) {
document.getElementById('fb_login_text').innerHTML = 'Logout';
if (response.session) {
FB.api('/me', function(response) {
var str;
str = response['id'] + ";" +
response['name'] + ";" +
response['first_name'] + ";" +
response['last_name'] + ";" +
response['link'] + ";" +
response['birthday'] + ";" +
response['gender'] + ";" +
response['email'];
alert(str);
});
}
else {
document.getElementById('fb_login_text').innerHTML = 'Login with Facebook';
}
}, { perms: 'user_birthday,email' });
};
</script>
As you see I don't use div fb-root anywhere but It is requered to facebook login work!
I struggled with this issue recently. The problem appeared from no where, presumably from some change in the Facebook JS SDK. For what its worth I plan to never use the JS SDK again, these random issues eat up my time.
Anyway here is the hack that I used to get around the issue.
var accessToken, fb_response;
if (window.location.hash.length < 30) {
window.location = "http://www.facebook.com/dialog/oauth?client_id=YOUR_ID&redirect_uri=YOUR_URL&scope=YOUR_PERMISSIONS&response_type=token";
} else {
fb_response = window.location.hash;
accessToken = fb_response.substr(14, fb_response.indexOf("&expires") - 14);
FB._authResponse = {
accessToken: accessToken
};
window.location.hash = "";
FB.api("/me", function(profile) {
if (profile.id) {
app_init();
} else {
alert("Problem connecting to Facebook");
}
});
}
Basically I send the user to the Facebook oauth dialog and when they return I grab the access token from the hash. I then set the internal access token parameter on the Facebook Object. Once this is done you can make all the normal Facebook Api calls.
Hopefully this helps someone!
For future projects I will definitely stick to a server side auth flow, you have a lot more control!
It seems that you are trying the localhost, can you try it with the public url.
I already faced this problem. But I solved it by configuring the canvas url in application as the public url (example. www.something.com/test/).
This is a working sample for me:
<!DOCTYPE html>
<html>
<head>
<title>Facebook Client-side Authentication Example</title>
</head>
<body>
<div id="fb-root"></div>
<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 : '00000000000000', // Your 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
FB.api('/me', function(me){
if (me.name) {
document.getElementById('auth-displayname').innerHTML = me.name;
}
})
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';
}
});
// respond to clicks on the login and logout links
document.getElementById('auth-loginlink').addEventListener('click', function(){
FB.login();
});
document.getElementById('auth-logoutlink').addEventListener('click', function(){
FB.logout();
});
}
</script>
<h1>Facebook Client-side Authentication Example</h1>
<div id="auth-status">
<div id="auth-loggedout">
Login
</div>
<div id="auth-loggedin" style="display:none">
Hi, <span id="auth-displayname"></span>
(logout)
</div>
</div>
</body>
</html>
The website clearly says that all.js is expired. However, I get the same error you got only with sdk.js. Problem was fixed when went back to the depreciated all.js
// Old SDK (deprecated)
js.src = "//connect.facebook.net/en_US/all.js";
// New SDK (v2.x)
js.src = "//connect.facebook.net/en_US/sdk.js";
facebook sdk
I recently upgraded to open graph and implemented some of the facebook social plugins on my website like fb:friendpile fb:like-box etc
Ever since I implemented these new features, I'm seeing some random behavior with these plugins.
Like on my home page, when you type in the URL and go for the first time, none of the facebook social plugins are rendered - no login button, no friendpile no like - nothing.
But when you hit CTRL F5 - they appear. First I thought it probably has somethin to do with my machine but yesterday two of my users reported the same issue.
I googled around and it seems to have something to do with where you place your connect code. Right now, I have this relevant portion of the script placed in my head tag - I even tried placing it right before the end of body tag - but it made no difference.
<script type="text/javascript">
window.fbAsyncInit = function() {
FB.init({appId: '<?php echo Zend_Registry::getInstance()->configuration->facebook->appid;?>', status: true, cookie: true, xfbml: true});
/* All the events registered */
FB.Event.subscribe('auth.login', function(response) {
// do something with response
login();
});
FB.Event.subscribe('auth.logout', function(response) {
// do something with response
logout();
});
};
(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);
}());
function login(){
document.location.href = "<?php echo $this->baseUrl(); ?>/login/log";
}
function logout(){
FB.init({appId: '<?php echo Zend_Registry::getInstance()->configuration->facebook->appid;?>'});
FB.logout(function(response) {
// user is now logged out
});
document.location.href = "<?php echo $this->baseUrl(); ?>/login/logout";
return false;
}
</script>
Any insights in trouble shooting this will be appreciated
Thanks
Your logout logic seems problematic (you call FB.logout() in logout() -- but also call logout() on the 'auth.logout' event, which seems circular). You should also remove the FB.init() call inside your logout() function. The lack of xmlns:fb on the <html> tag is often the cause of XFBML not rendering in IE, so I'd double check that. You could also try replacing the async loading with sync loading using a normal script tag like:
<script src="http://connect.facebook.net/en_US/all.js"></script>
But a live repro case would be more helpful since your code looks fine for the most part.
EDIT: You can also checkout http://fbrell.com/xfbml/fb:login-button for examples.