Implementing Facebook Single Sign-On
Those who read the previously published tutorial on uploading photos to Facebook are already familiar with the Facebook single sign-on functionality that’s now available in Corona.
But for those who missed the previous tutorial, and for the sake of having one-stop resource for helping you get single sign-on to play nicely with your app, we’ve decided to publish an entire tutorial dedicated to the topic.
Since this is a cross-platform feature, this tutorial will apply to both iOS and Android (though admittedly, there is much less setup involved on the Android side of things). You’ll also need to make sure you’re using Corona Build 2011.707 or higher.
Your Facebook app
Whether or not your app is live in an App Store, you’ll need to register your app on Facebook. Doing this will give you an “App ID” that you’ll need in the subsequent steps.
Once you have your app registered, it is very important that you check ‘Native iOS App’ (for iOS) or ‘Native Android App’ for Android (or both for cross-platform).
For iOS apps, in the ‘Native iOS App’ section, it is important that the iOS Bundle ID is the same as the provisioning profile that you’ll use to build your app in Corona. Also ensure that you enter a valid iTunes App ID in the iPhone App Store ID section. When you add your app to the iTunesConnect portal, your app will be assigned an “App Store ID” (even prior to uploading the binary).
If your app doesn’t have an iTunes App ID yet, you can use any valid iTunes App ID (just go to the ShowCase and pick an app), but be sure to change it to your app’s ID as soon as you get one!
It’s very important that you enter the proper bundle ID and a valid iTunes ID, or the Facebook implementation in your app will fail if the user has the Facebook App installed on their iOS device. Following the above steps will ensure everything works properly for all of your users.
build.settings
This section is for iOS-only, so if your app is Android-only, you won’t have to add anything to build.settings to get single sign-on working.
For iOS apps, you’ll need to add CFBundleURLTypes key, which includes an array with a CFBundleURLSchemes key. The tables must be nested exactly as shown in the example below, so I recommend copying and pasting:
iphone = {
plist = {
UIApplicationExitsOnSuspend = false,
CFBundleURLTypes =
{
{
CFBundleURLSchemes =
{
"fbXXXXXXXXXXXXXX",
}
}
}
}
}
}
By default, UIApplicationExitsOnSuspend is set to false if you don’t include it, but I included it in the example as a reminder that it must be set to false for Facebook single sign-on to work properly.
The next thing you must do is replace “fbXXXXXXXXXXXXXX” with “fb” + your Facebook App ID. So if your Facebook app ID is “1234567890″, then you would put: “fb1234567890″
You can also add more URL schemes to your app above or below the Facebook URL scheme entry, like so:
{
"fb1234567890",
"YourCustomScheme",
"AndAnotherOne"
}
Test, test, test!
Registering your app and modifying your build.settings should be enough to get Facebook single sign-on working in your app, but you should always test your app to be sure.
When you call facebook.login(), if the Facebook app is installed on the device, it will come up and ask to authorize your app (if it hadn’t been previously authorized). If the Facebook app is not installed, the device’s web browser will come up. When the user finishes logging in/authorizing, your app should be brought back up again (which is why UIApplicationExitsOnSuspend needs to be false).
Remember, Facebook single sign-on is only available to subscribers through the Daily Builds at the moment. Subscribe now to take advantage of this, along with tons of other great new features such as remote push notifications, url scheme handling, Email/SMS composing (to name a few), and everything else we’re continuing to roll out on a daily basis.
RSS feed
What about creating a android hash key? Do we need to download and install eclipse for this to install for a facebook hash? Or how do we do this? sounds like another article to me lol.. would be very very helpful.
See step 5 on facebook’s developer page via the link below on how to generate a hash from your Android keystore…
https://developers.facebook.com/docs/mobile/android/build/#sig
Two questions:
1. What if you don’t want your application to ‘exitonsuspend’ because that forces the player to start game all over again (like receving a call or accidentally hitting the ‘home’ key)?
2. What about posting scores to fb?
@Raul:
1. When UIApplicationExitsOnSuspend is set to ‘false’ (default; what it has to be set for Facebook SSO to work properly), then your app will resume where it left off (e.g. it won’t do a cold boot when you go back into your app). I think you may have had that backwards.
2. Posting scores to Facebook is another topic, and we are working on bringing an easier way for users to do things such as post scores, and a few more of the very common facebook/social tasks.
Jonathan,
#2 would be great.
It would also be great for an example where the developer provides pieces of the data (such as the name, caption, description, picture, and link) and the app then displays the Facebook post dialog where all that information is already filled in and not editable by the user, and the user can provide just the status update message related to the post.
How can i combine all of this into my build file? here is what i have, but the current setup doesnt work correctly
settings =
{
android =
{
versionCode = “12″
},
androidPermissions =
{
“android.permission.VIBRATE”
},
orientation =
{
default = “landscapeRight”,
supported =
{
“landscapeLeft”, “landscapeRight”
},
}
}
settings = {
orientation =
{
default = “landscapeRight”,
supported =
{
“landscapeLeft”, “landscapeRight”
},
}
}
iphone = {
plist = {
UIApplicationExitsOnSuspend = false,
CFBundleURLTypes =
{
{
CFBundleURLSchemes =
{
“fbXXXXXXXXXXXXXX”,
}
}
}
}
}
}
facebook SSO returns back and dont show any allow/deny screen on facebook app page, is it safe and ok? there is no error with auth and publishing, I can post a test message.
@Rxmarccall: “settings” is a lua table with nested tables within, so when you define settings again (via settings = {), you’re effectively making the first settings table irrelevant. Seems like this is what you want:
{
android =
{
versionCode = "12"
},
androidPermissions =
{
"android.permission.VIBRATE"
},
orientation =
{
default = "landscapeRight",
supported =
{
"landscapeLeft", "landscapeRight"
},
},
iphone = {
plist = {
UIApplicationExitsOnSuspend = false,
CFBundleURLTypes =
{
{
CFBundleURLSchemes =
{
"fbXXXXXXXXXXXXXX",
}
}
}
}
}
}
Also: don’t forget to replace XXXXXXXXX with your facebook app ID.
@Can: That usually happens if a) you’re already logged into facebook and b) if at some point you’ve already authorized that particular app for that facebook user (very common during development).
Thanks jonathan, that seems to have worked!
Is there any success/failure message on returning to my app from Facebook? I would like to present some sort of message to the user confirming that everything went as planned, but I can’t find a way to do that.
Everything works great with the browser. however, on IOS when Facebook app is installed, I do not get an authorization screen and the Facebook app redirects back to my app with login failed. What could be causing this? Thanks
@Soliman
I’ve got the same problem with you. Waiting for help.
Same problem as Soliman and Nirut..
@Soliman and others: the problem with Facebook app being installed usually occurs as a result of not implementing the last two paragraphs of the Your Facebook app section from the above article.
In short, ensure that in your app’s settings (on the Facebook developer site), that you are using a valid iTunes ID. You can use any valid iTunes ID, just be sure to switch it to yours when your app is ready for production. Or, you can create your app in iTunes Connect and you’ll get an iTunes App ID right away.
Tried a few different App IDs, still getting a failed login. I also have “Configured for iOS SSO” checked and “iOS native deep linking” unchecked in the facebook app config.
@Jonathan,
It would be nice if in your description of the custom URL scheme you referred to your other great blog entry:
http://blog.anscamobile.com/2011/12/using-app-url-schemes-in-ios/
Specifically, you should be able to test that your fb custom URL is working by going to Safari and doing “fb12345678://”. I personally got stuck with some very strange fb login failures because my custom URL was not configured properly. I did it as you outlined above, but it did not work until I added a CFBundleURLName (which, FWIW, you should always do). I think it may be the case that I previously had a version of my app installed with the same fb custom URL that was named differently and had since been deleted, but iOS still found two “apps” for that URL and didn’t have any way to distinguish them (it uses CFBundleURLName for that purpose), so it failed. Anyway, once I understood that I could test it via Safari and I confirmed the problem, it was a fairly easy path to fix it.
So I would add a step above after the custom URL configuration: “Launch Safari, type in ‘fbxxxxxxxx://’ and verify that it launches your app”. If not, see the app URL schemes blog entry and fix it before continuing.
Also, it’s probably worth noting that you don’t need to set a bundle ID on the FB app config. If you have bundle ID, then the fb auth is a little cleaner (it doesn’t require re-auth when logging in from a different device is the main difference). But it works just fine without a bundle ID.
Bob
@Jonathan: Nice tuto. Thank you.
Please, let me ask you something. I’m trying to add the like funcionality to our game and after search and read a while looking for how to do this, I found that I need to open a webpopup with a likebox inside it. My problem, is that when I open this popup and the user touch the like button, he has to login again. Is there a way to avoid this?
@Omid and others
I have the same problem. Did you figure out what was causing it?
I found my problem. I was using the full Bundle Id (THY12345YS.com.bla.gamename instead of com.bla.gamename)
Is there a plan for Corona to bring this to free user?
After 2 hours trying to get past “loginFailed”, when I have successfully made this work in the past, I’m ready to scream. Can’t you folks log something to give a clue why it might fail? I feel like I’m in the 18th century here!
@Jonathan
I have been trying to get the facebook connect app working and I have not been successful. I have been on facebook and created a facebook app. I have also made all the required changes on the corona sample app with my Facebook app ID and all.
However on the simulator and my handset as well, the app just displays the message “Not Connected” at the buttom. None of the app buttons works either. What am I getting wrong.
I’ve got facebook working on an IOS device but when prompted to login or any dialog, facebook language is set to french…. anyone knows what can be causing this behavior? my phone languaje is english and i don’t recall having any language configuration on corona or when making the request