How can I use Facebook Javascript SDK within a browser extension? - facebook

I want to use the Facebook JS SDK within a browser extension/sidebar. I've seen other questions about this, but no specific answers. I don't want to do separate OAuth handling - I'd prefer to use the JS SDK which makes this all transparent.
However, it seems that the FB.* calls never fire their callbacks at all. Am I missing something? Is it even possible to use the JS SDK within a non-hosted environment?
Example:
window.fbAsyncInit = function() {
FB.init({
appId : 'XXX',
status : true,
cookie : true,
xfbml : false
});
FB.getLoginStatus(function(response) {
alert('CALLBACK');
});
};
Thanks,
Matt Kruse

As stated on this blog post
Unfortunately, Facebook JavaScript SDK doesn’t work on a Chrome
Extension because it is working under “chrome-extension://” protocol.
While Google provides a tutorial for OAuth, Facebook explains a
slightly easier way.
Facebooks OAuth/login explanation

You could try the invisible iFrame technique posted here: http://brianmayer.com/2012/12/building-a-chrome-extension-that-connects-to-a-facebook-app/
But it seems like a lot of work.

Related

Facebook Page Tab : Error 191 (The specified URL is not owned by the application) but URLs are set

For a contest page, I use Page Tab within a Facebook App, but I can't set a Share dialog without getting this error.
window.fbAsyncInit = function()
{
FB.init({ appId: '##### (correctly set)',
status: true,
cookie: true,
xfbml: true,
oauth: true});
FB.Canvas.setAutoGrow();
}
window.fbAsyncInit = function()
{
FB.ui({
method: 'feed',
name:'name',
link:'https://expertsmo.ca/_fb/concours/1', // https://apps.facebook.com/expertsmo
caption:'test'
});
}
Here is the App conf
I checked many posts on this error code, most of these problems are caused by the URL not being set; in my case, URL is well set and I still get this error. I tried many many things, still not working ( this solution of a similar case doesn't seem to work because I can't find the field "Website With Facebook Login").
I also use PHP sdk to find out if the user likes the page already, or not.
Really, I can't find the solution to this problem ... any idea? Thanks...
You include the JavaScript SDK two times in the code, only one time with an App ID (that is different from the FB.init call). Make sure you are using the latest code from the Facebook docs and clean up old stuff. That error message comes up when the App ID is not correct, the settings should be fine.
https://developers.facebook.com/docs/javascript/quickstart/v2.0
You also use window.fbAsyncInit in a wrong way, this should only be used once when you open the page. FB.ui should get called on user interaction or you will also get problems with popup blockers.
Btw, you should put ALL JavaScript code right before the closing body tag (for many reasons). Not sure why you put the async function after the opening body tag.

facebook login api doesn't respond in phonegap wp8 app

I'm using phonegap 3.5.0-0.20.4 & wp8 platform. My FB.login call simply doesn't seem to do anything (no response). I checked other replies around similar problem, but none seem to help wp8 platform. Here is my sample code
FB.init({appId: "23...32", version: 'v2.0'});
FB.login(function (response) {
console.log(JSON.stringify(response);
}, { scope: "email" });
My login call simply doesn't go through. I do have webbrowser & device plugins installed on the phonegap app.
Any ideas?
There are deprecated documentation, try this
FB.login(['public_profile'], successCallbackFn, errorCallbackFn);
But this has no sense because facebook does not return callback functions on login after april's sdk update to version 3.14
Please let me know if facebook login will work for you.

FB.Login not working in Opera Mobile

I have a mobile web site using Facebook Connect to authenticate user. I encountered a problem login with Opera Mobile. I have below javascript to detect login status, but only in Opera Mobile the callback is not firing. Is anyone encountered this problem?
window.fbAsyncInit = function () {
FB.init({
appId: 'xxxx',
channelUrl: 'http://xxxx/channel.html',
status: true,
cookie: true,
xfbml: true
});
FB.Event.subscribe('auth.statusChange', handleStatusChange);
};
function handleStatusChange(response) { // --> NOT FIRE
if (response.authResponse) {
//Login, show Logout button
}
else {
//Show Login button
}
}
Please make sure you put the JS tags and other required HTML in a logical order (if you use an fb-root element put the scripts after it, try putting them inside BODY if they are currently in HEAD). I've seen FB login fail because the tags were in the wrong order, and because some browsers do "speculative parsing" this cause of random cross-browser malfunction may not be immediately obvious. (Besides, you create a race condition that might break in any browser if the network has a hiccup and the timing of loading stuff is unexpected..)
If you still have problems it would be useful to get a link or a demo to look at. We've tested a random page that uses FB Connect and worked fine. Apart from tag order issues I can't guess what might go wrong for you here.
Opera Mobile has new release today (12.10.ADR-1210081231). It solved the Facebook login issue, but there is a minor issue. The Facebook windows will not close automatically after user login.

Facebook deprecated share feature... but it is using it itself?

As we all know (http://developers.facebook.com/docs/share/) Facebook has deprecated the share function. However, the about to go live app center apparently is using the very same share UI.
Is there a way for the regular folks to access the same UI from JS SDK provided by Facebook? Assuming, it is not the same as described in https://developers.facebook.com/docs/share/.
Although it's deprecated, you can still use it in the way it was used before.
Facebook Share Documentation
However, It's not a good idea to use this. Instead, you can just create a facebook app and use FB.ui to perform this action:
Example Code:
<script>
FB.init({appId: "<your_app_id>", status: truey, cookie: true});
function postToFeed() {
FB.ui({
method: 'feed',
link: '<the_link>',
name: '<name>',
caption: '<caption>',
description: '<description>'
});
}
</script>

Where to download FaceBook JavaScript SDK and xd_receiver.htm

I have experience with PHP and JavaScript, but am new to using the FaceBook API. I'm carefully reading through the documentation, but notice thta lot of links within their documentation are broken. For example, the link for http://api.facebook.com/static/xd_receiver.htm is broekn and I need that content to be able to do almost anything with the FB API. Seriously, these guys seem to have really dropped the ball with their documentation. Does anyone know where I can get this file and the rest of the JavaScript SDK? Thanks.
<div id="fb-root"></div>
<script src="//connect.facebook.net/en_US/all.js"></script>
<script>
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.MYDOMAIN.COM/channel.html', // channel.html file
oauth : true // enable OAuth 2.0
});
</script>
The contents of the channel.html file should be this single line:
<script src="//connect.facebook.net/en_US/all.js"></script>
You don't necessarily download it yourself so much as load it when you want to use it.
Here's a link to the quickstart
https://developers.facebook.com/docs/javascript/quickstart/v2.0
Here is the documentation that facebook has for their Javascript SDK. There are some areas that are poor (to put it lightly), but most of it is there, or in the comments/forums created by users