$ cordova plugin add us.yapplabs.cordova.plugins.facebooklite
This is the official plugin for Facebook in Apache Cordova/PhoneGap!
To use this plugin you will need to make sure you've registered your Facebook app with Facebook and have an APP_ID (https://developers.facebook.com/apps).
If you plan on rolling this out on iOS, please note that you will need to ensure that you have properly set up your Native iOS App settings on the Facebook App Dashboard. Please see the Getting Started with the Facebook SDK: Create a Facebook App section, for more details on this.
If you plan on rolling this out on Android, please note that you will need to generate a hash of your Android key(s) and submit those to the Developers page on Facebook to get it working. Furthermore, if you are generating this hash on Windows (specifically 64 bit versions), please use version 0.9.8e or 0.9.8d of OpenSSL for Windows and not 0.9.8k. Big ups to fernandomatos for pointing this out!
|_example | |_Simple | | |_index.html | |_HackBook | |_index.html | |_README | |_hackbook.manifest | |_img | |_css | |_js |_test | |_pg-plugin-fb-connect-tests.js |_src | |_android | | |_ConnectPlugin.java | | |_facebook | |_ios | |_FacebookConnectPlugin.m | |_FacebookConnectPlugin.h | |_facebook |_www | |_cdv-plugin-fb-connect.js | |_facebook_js_sdk.js
www/facebook_js_sdk.js is the modified facebook-js-sdk. It already includes the hooks to work with this plugin.
src/ios contain the native code for the plugin for both Android and iOS platforms. They also include versions of the Android and iOS Facebook SDKs. These are used during automatic installation. During manual installation, you are encouraged to download the most recent versions of the Facebook SDKs for you projects.
If using this plugin on Adobe PhoneGap Build you can ignore the instructions below and go straight to the PhoneGap Build documentation available here.
In the Cordova Android application you will need to put the following in your
res/xml/config.xml file as a child to the plugin tag:
<plugin name="org.apache.cordova.facebook.Connect" value="org.apache.cordova.facebook.ConnectPlugin" />
You'll need to set up the Facebook SDK for Android:
Add a new
com.facebook.LoginActivity activity to your app to handle Facebook Login. Open up your
AndroidManifest.xml file and add this additional activity:
<activity android:name="com.facebook.LoginActivity" android:label="@string/app_name" />
From the Cordova Facebook Plugin folder copy ConnectPlugin.java from
src/android/ folder into the root of your Cordova Android application into
src/org/apache/cordova/facebook/. You may have to create that directory path in your project.
From the Cordova Facebook Plugin folder copy the
example/HackBook/ files into your application's
assets/www folder. Overwrite the existing index.html file.
Replace your appId in the new index.html file. Leave the quotes.
Now you are ready to create your application! Check out the
example folder for what the HTML, JS etc looks like.
You can run the application from either the command line (
ant clean && ant debug install) or from Eclipse.
NOTE 1: If you are having problems with SBJSON conflicts, download the latest version of git clone the latest cordova-ios code, build the installer, and run the installer to get updated!
NOTE 2: If you're upgrading from SDK 3.0 to 3.1 in the iOS6, you can't ask for both read and write permissions when the user is authenticating. If you do this you'll get a
com.facebook.sdk error 2 error alert. This happens due to a flow change in the 3.1 SDK. More info about this can be found in the official docs. Also, make sure you have configured the app's Bundle ID in the Facebook app details, under the "Native iOS App" configuration, otherwise you'll get another
com.facebook.sdk error 2 alert. At least, if some of your earlier authentications failed, the device may turn the app to off in Settings > Facebook > Allow These Apps to Use Your Account, so, make sure your app is allowed.
(To be updated) View the Video
Create a basic Cordova iOS application by following the PhoneGap Getting Started Guide
config.xmlfile in the project navigator and add a new entry as a child to the plugin tag:
<plugin name="org.apache.cordova.facebook.Connect" value="FacebookConnectPlugin" />
The Facebook SDK will try to access various URLs, and their domains must be whitelisted in your config.xml under access.
You can either add each subdomain separately:
Or you can allow all domains with (set to this by default):
Make sure you add the scheme to your [PROJECTNAME]-Info.plist (located as one of the files in your Xcode project), substitute [APP_ID] below to the appropriate values (replace those brackets!). This is to handle the re-direct from Mobile Safari or the Facebook app, after permission authorization.
<key>CFBundleURLTypes</key> <array> <dict> <key>CFBundleURLSchemes</key> <array> <string>fb[**APP_ID**]</string> </array> </dict> </array>
This plugin is based on plugman. To install it to your app, simply execute plugman as follows; It does not currently work with plugman at all. WORK IN PROGRESS
plugman install --platform [PLATFORM] --project [TARGET-PATH] --plugin [PLUGIN-PATH] --variable APP_ID="[APP_ID]" --variable APP_NAME="[APP_NAME]"
where [PLATFORM] = ios or android [TARGET-PATH] = path to folder containing your phonegap project [PLUGIN-PATH] = path to folder containing this plugin [APP_ID] = Your APP_ID as registered on Facebook