Facebook Connect plugin using Phonegap Build

Question

I've seen lots of questions about the Facebook Connect plugin using Phonegap only or Phonegap and Phonegap Build, but I still can't seem to make it work.

I created my facebook app (actually all I did was clik the "Create New App" button). I specified the Display Name and Namespace and got an app ID. I updated the code from https://github.com/amirudin/pgb-fbconnect (which is the simple example for the Facebook Connect plugin) with my app ID and Namespace in both index.html and config.xml. I zipped it to Phonegap Build (no Phonegap version is specified in config.xml so it defaults to 2.9).

On Android (2.3.6 and 4.1) I always get Cordova Facebook Connect plugin fail on init! On iOS nothing is displayed but nothing works either.

As this alert is only shown when calling FB._nativeInterface.init, I tried using nativeInterface : false instead of nativeInterface : CDV.FB in FB.init. In that case if I try to login, the login page is displayed but after entering my name and password I get Given URL is not permitted by the application configuration.: One or more of the given URLs is not allowed by the App's settings....

I'm not sure how to configure the facebook app:

• I selected Native iOS App, specified the Bundle ID (same as the App ID I created on developer.apple.com, same as widget ID in Phonegap Build config.xml) and enabled Facebook Login. iPhone and iPad App Store ID are left to 0, Deep Linking is disable and URL scheme suffix is blank.

• I selected Native Android App, specified the Package Name (same as widget ID in Phonegap Build config.xml), the Key Hashes (one hash - I also added the key to Phonegap Build - by the way, is it normal that the key is unlocked for only one hour, while for iOS it's one month?), enabled Facebook Login. I don't know what I should use for Class Name (I tried leaving it empty, then using the same as Package Name and adding ".activity" at the end). Deep Linking is left to disabled. Here is what I used to generate the key and hash:

  // Generate key

  keytool -genkey -v -keystore my-release-key.keystore -alias alias_name -keyalg RSA -keysize 2048 -validity 10000

  // Get hash (uses OpenSSL 0.9.8e on Win7 64)

  keytool -exportcert -alias alias_name -keystore my-release-key.keystore | openssl sha1 -binary | openssl base64

• I tried setting App Domains to localhost, but then I'm told I need to also set the site URL, or Canvas URL.

• so I also selected Website with Facebook Login, and specified http://localhost/ for Site URL
• and selected App on Facebook, specified http://localhost/ for Canvas URL and https://localhost/ for Secure Canvas URL. I left Canvas Width and Canvas Heigth to Fixed and Fluid, and Unity Integration Enabled to Disabled

Event after that I still get the same Given URL is not permitted by the application configuration... error. I know Phonegap uses file:// and not http://localhost but then I just don't know how to configure the facebook app.

I'm not sure if the Cordova Facebook Connect plugin fail on init! error is linked or not with the App Domain issue or if it's two unrelated issues that I'll have to solve.

Answer 1

Trying my app on another Android phone the next day, I noticed I had no more error. I removed and reinstalled the app on the other Android phones and the plugin also started working fine on all of them.

I'm not sure what the problem might have been: issue with hydra plugin (now I know if something weird happens I may have to remove and reinstall the app, and make sure the hydration is complete), needed more time after creating the app on facebook (even if it's stated it can take minutes, and not hours, to update all the servers), ...