FB.Connect.showPermissionDialog
If your facebook iframe applications need extra permissions granted, you can use Facebook JavaScript Api to generate modal window over your content to request permissions from users. For this purpose I created a simple FB_test_perm() function. It takes 4 arguments:
- api_key – your application api key
- xd_receiver – path to xd_receiver.htm file (Cross-Domain Receiver Page)
- permission – publish_stream, read_stream …
- callback – your function with boolean return (true if permission granted, false if not granted)
facebook_permission_test.js
function FB_test_perm(api_key, xd_receiver, permission, callback)
{
FB.Bootstrap.requireFeatures(["Connect"], function()
{
FB.Facebook.init(api_key, xd_receiver);
FB.Connect.requireSession(function()
{
FB.Facebook.apiClient.users_hasAppPermission(permission, function(result)
{
if (result != 0)
return callback(true);
FB.Connect.showPermissionDialog(permission, function(result)
{
return callback(result == null ? false : (result.indexOf(permission) != -1));
}, true, null);
});
});
});
}
index.html
<html>
<body>
<script src="http://static.ak.facebook.com/js/api_lib/v0.4/FeatureLoader.js.php" type="text/javascript"></script>
<script src="facebook_permission_test.js" type="text/javascript"></script>
<script type="text/javascript">
function FB_perm_result(value){
alert(value ? "granted" : "not granted");
}
FB_test_perm("***", "xd_receiver.htm", "publish_stream", FB_perm_result);
</script>
<!-- Note: Include this div markup as a workaround for a known bug in this release on IE where you may get a "operation aborted" error -->
<div id="FB_HiddenIFrameContainer" style="display:none; position:absolute; left:-100px; top:-100px; width:0px; height: 0px;"></div>
</body>
</html>
xd_receiver.htm
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" >
<head>
<title>Cross-Domain Receiver Page</title>
</head>
<body>
<script src="http://static.ak.facebook.com/js/api_lib/v0.4/XdCommReceiver.js?v2" type="text/javascript"></script>
</body>
</html>
If you can not get your facebook showPermissionDialog popup opened, make sure you set Canvas Callback URL, Connect URL, Base domain, Connect Preview URL correctly:
Make sure you embed flash in transparent / opaque wmode and iframe size (width, height) is enough to display facebook modal window.
can’t seem to get it to work when it’s an iframe. if i open the iframe in a new window… then the button works. but it not, it won’t. makes me think the whole “set the urls part” has been done incorrectly.
well, it works for me, make sure your iframe height is enough
Great resource!
Very useful! Thanks for sharing it!
Thanks – I could not get anything to work for the permissions and this finally did it! Thank you!
Finding the sentence “make sure you set Canvas Callback URL, Connect URL, Base domain, Connect Preview URL correctly” made my day!
Thank you so much. I was really hitting a wall with this. Much appreciated.
This was a great help. Thanks
Please, could you show the sample actionscript to call this?
hi rick, to call javascript function from actionscript, use ExternalInterface class.
read more here:
http://livedocs.adobe.com/flash/9.0/ActionScriptLangRefV3/flash/external/ExternalInterface.html
sample here:
http://blog.yoz.sk/2009/10/flex-iframe-web-browser-in-flash/
Hi,
This is very useful, thanks. But a question…of most of the flash games I’ve played, I don’t recall having to explicitly give them permission to post stories to my wall. When a user installs an application, the default setting is already to allow this…why is this extra step necessary?
Thanks,
John
hi John,
there is more different types of permissions user can grant to your app, read more about it here:
http://wiki.developers.facebook.com/index.php/Extended_permissions
for example I use publish_stream permission when I need my app to upload a photo into an album and make the album and each photo automatically public (without user confirmation for each photo / album)
Great post!! Thanks. It perfectly works
Well, my problem is for testing my iFrame app, I use a dynamic IP address for Canvas Callback URL, which works fine. But facebook setting page won’t let me use an IP address for Connect URL. Therefore, when I call showPermissionDialog, facebook callback is made to my real site domain and not the IP I’m testing on and I don’t get the response back. Is there anyway to point facebook respnse to a test IP address instead of site base URL?
Hi Brad, I am also having difficulties with testing applications before launch. Is the ip you are trying to use public one? If public and facebook just won’t let you do that, try create some testing domain, or just map your ip to subdomain (via dns)
Hi!
Thanks, article helped a lot!
Hi,
This is article helped me a lot so thanks. But I found one more detail here. The permission dialog sometimes don’t show up because firebug is enabled in FF.
I’m using FF 3.5.8, Firebug 1.5.2, OS Win Xp SP3
HEY very nice… now a little question:
I used this useful tutorial to gain access of offline_access and stream_publish, but I would like to know HOW DO I SAVE THE SESSION KEY?
I’m sorry I’m kinda newb on javascript, I would like to know how can I save on a MySQL database. Maybe redirecting the page to a php site and do the magic with the sessions keys
thank you in advance
Hi wirelezz, thanx for your comment
In case when user already allowed your application, your iframe receives fb_sig_session_key as an request GET parameter. That is accesible via javascript (client side) or any backend (php…), so it is pretty straight how to use it, but I wonder why would someone do that. fb_sig_session_key is not meant to be used as identificator
http://wiki.developers.facebook.com/index.php/Authorizing_Applications#Parameters_Passed_to_Your_Application
http://forum.developers.facebook.com/viewtopic.php?pid=41894
Thanks heaps! Great info – it saved me a lot of time.
I have used successfully your code. However, I have a problem when I try to get the permits for email. Do you know how to solve this?
thanks in advance
Hi Fernando,
in facebook developer / your app / migration / set New Data Permissions = Enabled, now you may use any permissions from:
http://developers.facebook.com/docs/authentication/permissions
I’m just wondering, is there any way to request multiple permissions
like “read_stream, publish_stream, upload_photo”. thanks
@Ian, it is possible read http://developers.facebook.com/docs/reference/oldjavascript/FB.Connect.showPermissionDialog … but this is a part of old JavaScript API that may become obsolete soon
hi all,
its a useful thing but i am unable to get email permission popup on my game iframe. I am new to the facebook api. I have an iframe in which i embed my swf file of game. I need to get email permission from user and i am unable to get this popup. In my index.php file I have the iframe in which my game is loaded. and this swf file is embedded in another page index2.php. I load this index2.php in that iframe. where should i write this js code? in index.php or in index2.php? I have tried it in index2.php but its not working. I will appreciate your help in this regard.
thanks
@Alina, facebook has introduced new permissions since this article. Read more here http://developers.facebook.com/docs/authentication/permissions . This article has been published 9 months ago. Its like an dinosaur with all the everyday facebook api changes… however I recomend to require all permissions with application authentication