Implementing Facebook Single Sign-On

Share on Facebook0Share on Google+5Tweet about this on TwitterShare on LinkedIn0

Facebook Single Sign-On in Corona SDKThose 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:


settings = {
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:


CFBundleURLSchemes =
{
"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.

Share on Facebook0Share on Google+5Tweet about this on TwitterShare on LinkedIn0
jonbeebe

This entry has 38 replies

  1. Larr Meadows says:

    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.

  2. Joshua Quick says:

    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

  3. Raul says:

    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?

  4. Jonathan Beebe says:

    @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.

  5. thegdog says:

    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.

  6. Rxmarccall says:

    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”,
    }
    }
    }
    }
    }
    }

  7. Can says:

    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.

  8. Jonathan Beebe says:

    @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:


    settings =
    {

    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.

  9. Jonathan Beebe says:

    @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).

  10. Rxmarccall says:

    Thanks jonathan, that seems to have worked!

  11. Adrian Harris Crowne says:

    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.

  12. Soliman says:

    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

  13. Nirut says:

    @Soliman

    I’ve got the same problem with you. Waiting for help.

  14. Omid says:

    Same problem as Soliman and Nirut..

  15. Jonathan Beebe says:

    @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.

  16. Omid says:

    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.

  17. Bob Dickinson says:

    @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

  18. Maykel says:

    @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?

  19. Simon says:

    @Omid and others

    I have the same problem. Did you figure out what was causing it?

  20. Simon says:

    I found my problem. I was using the full Bundle Id (THY12345YS.com.bla.gamename instead of com.bla.gamename)

  21. Weilies says:

    Is there a plan for Corona to bring this to free user?

  22. David Gross says:

    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!

  23. Eeuro23 says:

    @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.

  24. CirrusDake says:

    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

  25. I have the same problem, it opens facebook and then an empty dialog box; after that takes me back to my app…

  26. [Solved] The day after it just worked! I guess it has to do with facebook propagation or something… I thought you should know…

  27. Vudumagix says:

    How can I Sharing a facebook App ID across Multiple Apps? for example a free and paid version

    • Hi, did u find a trick to fix this problem? I also have an app which is both free and paid and when both are installed, iOS open randomly one or the other when back from FB….

  28. Carl says:

    ios facebook posting. it was working, posting to facebook fine. and then stopped working. now facebook page comes up and then returns to app without posting. have rechecked and checked code. on changes were made. and code still works just fine in the android version.

    i am a loss.

    • eng_dev says:

      can u post ur code for android version if it still working ??

  29. Didi says:

    Thank’s you !!
    My provisioning profile was not the same !

  30. Neil says:

    As per Weilies reply above, I’d like to know whether the Facebook SSO is going to be available to free users?

    I can’t understand why you’d restrict such functionality (or any functionality for that matter) on the free version, when simply preventing apps from being monetized should be reason enough to buy a subscription!

    Why not enable the Facebook SSO for us free users, and append some Corona promotional blurb/link to any Facebook posts we make? This’d enable us to test properly and get you some free ‘advertising’ at the same time?!

  31. Peter says:

    So….. till SDK 734 is worked as well. And after, nothing. So, i make the app, build with SDK734, and all was fine. If i use SDK 863 for example, then no login window, just open safari, or fb application if is installed, and can not login, or invalid url is the message what i recive….. The question is, not possibile to set it back the older SDK working? That was so simple, and that was worked. I try to change all app keys and all details for an older, working apps keys. Of course not working….. But if i use SDK730 (and older xcode, iphone sdk) then is working, without to change anything in the programming…..

  32. Pisit says:

    Just tested 868 build with Facebook App installed on Andriod show loginFailed but with no Facebook App it works fine. :s

  33. Aaron Isaksen says:

    I’m having similar troubles: authentication on iOS works fine via web browser, but if facebook native app is installed, then it doesn’t work. It just opens up a page for the app inside Facebook native app, but doesn’t give me the ability to accept authorization. please fix ASAP! need to launch soon.

  34. Aaron Isaksen says:

    i reinstalled my app and reinstalled facebook native app, and now things seem to work. So not sure whats going on, but now things are ok.

  35. Hector says:

    Hey guys, I think this post needs to be updated per the fix posted on this forum post http://forums.coronalabs.com/topic/32821-please-help-have-error-in-facebook-ios-lua/?hl=%2Bfacebook+%2Bsso as it contains a new line that we need to add to the build.setttings file.

    I think even the Facebook sample code is missing this fix. I’ve been trying to make Facebook SSO work until I found this solution in the forum today

    Regards
    Hector

  36. Jam says:

    is this available to Free users?? x) loosing sight of Corona SDK….. everytime I dig in to deep to it, it keeps on disappointing me

Leave a reply

You may use these HTML tags and attributes: <a href="" title="" rel=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code class="" title="" data-url=""> <del datetime=""> <em> <i> <q cite=""> <s> <strike> <strong> <pre class="" title="" data-url=""> <span class="" title="" data-url="">