I'm unable to get the page access token for some reason I only recieve the page id...
this is my code:
<html>
<head>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.js" type="text/javascript"></script>
</head>
<body>
<div id="fb-root"></div>
<script>
window.fbAsyncInit = function() {
FB.init({
appId : 'APP-ID',
status : true,
cookie : true,
xfbml : true,
oauth : true,
});
};
(function(d){
var js, id = 'facebook-jssdk'; if (d.getElementById(id)) {return;}
js = d.createElement('script'); js.id = id; js.async = true;
js.src = "//connect.facebook.net/en_US/all.js";
d.getElementsByTagName('head')[0].appendChild(js);
}(document));
</script>
<div class="fb-login-button" data-scope="email,user_checkins,manage_pages">Login with Facebook</div>
<div class="result">Start</div>
<div class="result_app_installed">Start</div>
<script>
// Get access token
$.get('https://graph.facebook.com/102561956524622?fields=access_token', function(data) {
alert(data);
});
// Get data if user is application is installed on that page or not.
$.get("https://graph.facebook.com/102561956524622/tabs/255792581098802",
function(data) {
alert(data);
});
</script>
</body>
</html>
What I am trying to do is to get the page access token and then check if application in installed on that page..
What am I doing wrong?
Try something like:
FB.api('/me/accounts',function(response) {alert(response);})
The Page token is returned in data as access_token
You will need manage_pages permission.
https://graph.facebook.com/102561956524622?fields=access_token
won't work. In order to get an access_token for any fan page You need to do the steps explained here:
writing on the wall on behalf of my fanpage
Instead of using $.get it's better to use Facebook JavaScript SDK:
https://developers.facebook.com/docs/reference/javascript/
so for the second request it would be:
FB.api('/102561956524622/tabs/255792581098802',
function(response) {
alert(response);
});
Bear in mind that in order to make this FB.api call You need to authorize the app first
Actuelly its very easy
FB.api('/'+[PAGE_ID]+'?fields=id,likes,name,access_token', function(response) {
console.log(response.access_token);
});
Dont forget to check if user is logged in.
Related
Hi I have been dealing with facebook apps and actions a lot lately and it doesn't seem to work for me. Now I hear that the social button for likes is about to migrate and I can't figure out how to even publish the like built-in action via the app I created (it's an app for websites).
The code to publish actions I have taken from here: https://developers.facebook.com/docs/opengraph/tutorial/ and this is what they say:
<head prefix="og: http://ogp.me/ns# [YOUR_APP_NAMESPACE]:
http://ogp.me/ns/apps/[YOUR_APP_NAMESPACE]#">
<title>OG Tutorial App</title>
<meta property="fb:app_id" content="[YOUR_APP_ID]" />
<meta property="og:type" content="[YOUR_APP_NAMESPACE]:recipe" />
<meta property="og:title" content="Stuffed Cookies" />
<meta property="og:image" content="http://fbwerks.com:8000/zhen/cookie.jpg" />
other metatag properties etc.
<script type="text/javascript">
function postCook()
{
FB.api(
'/me/[YOUR_APP_NAMESPACE]:cook',
'post',
{ recipe: 'http://fbwerks.com:8000/zhen/cookie.html' },
function(response) {
if (!response || response.error) {
alert('Error occured');
} else {
alert('Cook was successful! Action ID: ' + response.id);
}
});
}
</script>
</head>
<body>
<div id="fb-root"></div>
<script>
window.fbAsyncInit = function() {
FB.init({
appId : '[YOUR_APP_ID]', // App ID
status : true, // check login status
cookie : true, // enable cookies to allow the server to access the session
xfbml : true // parse XFBML
});
};
// Load the SDK Asynchronously
(function(d){
var js, id = 'facebook-jssdk'; if (d.getElementById(id)) {return;}
js = d.createElement('script'); js.id = id; js.async = true;
js.src = "//connect.facebook.net/en_US/all.js";
d.getElementsByTagName('head')[0].appendChild(js);
}(document));
</script>
etc etc.
<form>
<input type="button" value="Cook" onclick="postCook()" />
</form>
<fb:activity actions="[YOUR_APP_NAMESPACE]:cook"></fb:activity>
the fact is that I am not able to publish any action (returns an error) and of course my app has the actions I am trying to publish. Doesn anyone have a clue? I'm not a professional developer but the ones I asked had no solution...
Many thanks!
I found the problem!
Apparently the include function in PHP had the headed we used around the website conflict with the Facebook metadata. When I removed the headers and the "php start", all functions (comments included) were working.
It still seem a peculiar issue though: apparently Facebook's API doesn't clear the cache, so now we have to create new pages to enable functions. No way to have them in the current page locations.
<div id="fb-root"></div><script>
(function(d, s, id) {
var js, fjs = d.getElementsByTagName(s)[0];
if (d.getElementById(id)) return;
js = d.createElement(s); js.id = id;
js.src = "//connect.facebook.net/en_US/all.js#xfbml=1&appId=223245147771570";
fjs.parentNode.insertBefore(js, fjs);}
(document, 'script', 'facebook-jssdk'));
FB.Event.subscribe('edge.create',
function(response) {
alert('You liked the URL: ' + response);
});</script>
<h1>Lajknout stranku!</h1>
<div class="fb-like" data-href="https://www.facebook.com/Testra22" data-send="false" data-layout="button_count" data-width="10" data-show-faces="false" data-font="trebuchet ms"></div>
I use this code to create FB Like button and I would like to display alert when user click on it. But there is js error Uncaught ReferenceError: FB is not defined.
You start using Facebook JS SDK before it was loaded by browser.
Because you use asynchronous way to load the JS SDK you need to define window.fbAsyncInit (as described in documentation for JavaScript SDK) function and run code that depend on JS SDK from here...
window.fbAsyncInit = function() {
FB.Event.subscribe('edge.create', function(response) {
alert('You liked the URL: ' + response);
});
}
I am frustrated because I spent hours on this - there are also other threads on this here on SO but none of them solved my problem!
I simply want to implement the fb-like button on my website, www.posti.sh - I wonder why it doesn't work?
Here is the code I use, according to https://developers.facebook.com/docs/reference/plugins/like/ step by step tutorial:
<div id="fb-root"></div> (directly after the opening body tag)
and
<div class="fb-like" data-href="http://www.posti.sh" data-send="true" data-width="450" data-show-faces="true"></div>
where I would like it to be.
I have also added the according meta tags in the head.
Anyone any idea why it doesn't work?
Thank you!!
Dennis
UPDATE 1
I have used the fb debugging tool https://developers.facebook.com/tools/debug and it only says the og image is not big enough - I guess that shouldn't be a problem though?
It looks like Step 1 in the HTML5 Like Button code is missing the part that actually adds the Javascript SDK. The code should be:
<div id="fb-root"></div>
<script>
window.fbAsyncInit = function() {
FB.init({
appId : 'YOUR_APP_ID', // App ID
channelUrl : '//WWW.YOUR_DOMAIN.COM/channel.html', // Channel File
status : true, // check login status
cookie : true, // enable cookies to allow the server to access the session
xfbml : true // parse XFBML
});
// Additional initialization code here
};
// 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));
</script>
Just now I resolved similar issue.
FB-like button was displayed but didn't work.
In my page <div id="fb-root"></div> was in a div with position: relative; css-attribute.
After removing position: relative; it works again.
I've ran into a problem with a canvas app. If the code for the Like button is enabled, the FB.ui call 'apprequests' gives an error. If I comment out the Like button, its back to normal. Calls with 'stream.publish' work normally tho.
My Init code:
FB.init({
appId : '12345',
status : true,
cookie : true,
xfbml : true,
channelUrl : '/channel.html',
oauth : true
});
The code for the Like button, generated with the FB tool:
<div style="padding-left:177px">
<div id="fb-root"></div>
<script>(function(d, s, id) {
var js, fjs = d.getElementsByTagName(s)[0];
if (d.getElementById(id)) {return;}
js = d.createElement(s); js.id = id;
js.src = "//connect.facebook.net/en_US/all.js#xfbml=1&appId=12345";
fjs.parentNode.insertBefore(js, fjs);
}(document, 'script', 'facebook-jssdk'));</script>
<div class="fb-like" data-href="http://www.facebook.com/apps/application.php?id=12345" data-send="false" data-width="450" data-show-faces="false" data-colorscheme="dark"></div>
</div>
The FB.ui call:
FB.ui(
{
method: "apprequests",
display: "iframe",
message: "You have to check this out!"
},
function(response) {
if (response && response.request_ids) {
$.post("response.php", { rid: response.request_ids, data: data }, function(result) {
});
}
}
);
The Error users get when the FB.ui is called:
API Error Code: 102
API Error Description: Session key invalid or no longer valid
Error Message: Iframe dialogs must be called with a session key
Any help is appreciated!
You have to pass a valid access_token when using the 'iframe' display method per: https://developers.facebook.com/docs/reference/dialogs/
just remove display: "iframe", worked for me. it will still show in an iframe, but without error. don´t ask my why, with 1:1 the same app settings it works WITH the display value in another app of mine...
Uncaught ReferenceError: _onloadHook is not defined
Why? My code is below:
<!DOCTYPE html xmlns="http://www.w3.org/1999/xhtml" xmlns:fb="http://www.facebook.com/2008/fbml">
<html>
<head>
<script src="http://connect.facebook.net/en_US/all.js#xfbml=1"></script>
<script type="text/javascript">
//Initialize facebook
FB.init({
appId : '12345',
status : true, // check login status
cookie : true, // enable cookies to allow the server to access the session
xfbml : true, // parse XFBML
channelUrl : 'http://www.abc.com/channel.html', // channel.html file
});
</script>
</head>
<body>
<div id="fb-root"></div>
<fb:send href="http://abc.com/blah" font="lucida grande" ref="codes_popup"></fb:send>
<fb:send href="http://abc.com/blah" font="lucida grande" ref="codes_popup"></fb:send>
</body>
</html>
Edit: When I have multiple this will happen. When I only have one "send" button , the error is not there.
For every extra "Send" button, the error occurs.
This is a bug in the Facebook Platform; it has already been reported as bug #20041.
Place the Facebook JS library and JS code scripts under the fb-root div:
<!DOCTYPE html xmlns="http://www.w3.org/1999/xhtml" xmlns:fb="http://www.facebook.com/2008/fbml">
<html>
<head>
</head>
<body>
<div id="fb-root"></div>
<script src="http://connect.facebook.net/en_US/all.js"></script>
<script type="text/javascript">
//Initialize facebook
FB.init({
appId : 'XXX',
status : true, // check login status
cookie : true, // enable cookies to allow the server to access the session
xfbml : true, // parse XFBML
channelUrl : 'http://www.abc.com/channel.html', // channel.html file
});
</script>
<fb:send href="http://abc.com/blah" font="lucida grande" ref="codes_popup"></fb:send>
</body>
</html>
I have been getting the exact same error today.
As ifaour mentions, the FB documentation says that you need to place the FB <script> tags under the <div id="fb-root"></div>. However, in his example and in the FB documentation, they put the scripts directly under the <div id="fb-root"></div>. I was doing that and still getting the error the OP mentions. I was finally able to solve the problem by moving the FB <script> tags to the very bottom of the page, right before the closing </body> tag. I believe what was happening is that some of my other scripts were interfering with the loading of the FB scripts. Hope that helps.
You should call the facebook javascript using the upgraded async method. This will make sure that the whole DOM is loaded so that the fb:root is already on the page.
http://developers.facebook.com/docs/reference/javascript/FB.init/
<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
channelUrl : 'http://www.yourdomain.com/channel.html', // Custom Channel URL
oauth : true //enables OAuth 2.0
});
};
(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>
Also critically important is to add support for OAuth 2.0 http://developers.facebook.com/blog/post/525/
oauth : true
As of Oct 1 if you don't have that your apps will stop working properly.