Wednesday, April 6, 2011

facebook sdk load

Android

Before you begin development with the Facebook Android SDK, you will need to install the Android SDK and dev tools, Git (the source control client we use for this SDK) and then clone the lastest version of the SDK from GitHub:
Once you have everything installed, open Eclipse and create a new Android Project (File | New | Project ...). We will use this project for the Facebook Android SDK source and then reference it from our app. As such, we need to get the content by selecting Create project from existing source and specifying the facebook directory from your git repository (~/facebook-android-sdk/facebook).
With the SDK project created, we can create the app. Create a new Android Project (the Facebook SDK project will stay open in the Eclipse Workspace) from File | New | Project..., using the defaults and populating the require fields.
Once your app project is created, you will need to add a reference to the Facebook SDK project. You do this by opening the properties window for our app (File | Properties), selecting the Android item from the list, pressing the Add... button in the Library area and selecting the Facebook SDK project created above.
Once the Facebook SDK is referenced, the app manifest needs to be modified to allow the app to make network calls to Facebook. This is accomplished by adding the following to the AndroidManifest.xml file in the app project:
<uses-permission android:name="android.permission.INTERNET">
</uses-permission>
We now need to do is a export the signature for your app so that Facebook can use to ensure users are only communicating with your app on the Android. This is done by running the keytool. The following shows how to export the key for your app using the debug defaults specified by the Android SDK and Eclipse:
keytool -exportcert -alias androiddebugkey -keystore ~/.android/debug.keystore 
| openssl sha1 -binary
| openssl base64
This tool generates a string that must be registered in the Mobile & Devices section of the Developer App for your app:

Installing the Facebook Android App

To help with debugging your app in the Android emulator, we provide a binary image of the Facebook Android that you can install with the adb tool in the Android SDK.
adb install ~/facebook-android-sdk/Facebook.apk
Your app will still work without installing this image, but we will default to using Platform Dialogs for sign-in rather than using the Facebook App requiring you to sign-in every time you run your app in the emulator.

Single-Sign-On (SSO)

As with the iOS SDK, one of the most compelling features of the Android SDK is Single-Sign-On (SSO). SSO lets users sign into your app using their Facebook identity. If they are already signed into the Facebook Android app on their device they do not have to even type a username and password. Further, because they are signing to your app with their Facebook identity, you will have access to their profile information and social graph.
Adding SSO to your app is very simple with the Facebook SDK. The below example outlines what code must be written to enable this feature. For the sake of simplicity, SSO functionality will be added to the Activity that was created by Eclipse when the app project was created:
package com.greatap;

import android.app.Activity;
import android.content.Intent;
import android.os.Bundle;
import com.facebook.android.*;
import com.facebook.android.Facebook.*;

public class MyGreatActivity extends Activity {

    Facebook facebook = new Facebook("YOUR_APP_ID");

    @Override
    public void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.main);

        facebook.authorize(this, new DialogListener() {
            @Override
            public void onComplete(Bundle values) {}

            @Override
            public void onFacebookError(FacebookError error) {}

            @Override
            public void onError(DialogError e) {}

            @Override
            public void onCancel() {}
        });
    }

    @Override
    public void onActivityResult(int requestCode, int resultCode, Intent data) {
        super.onActivityResult(requestCode, resultCode, data);

        facebook.authorizeCallback(requestCode, resultCode, data);
    }
}
When the above Activity is built and run as part of your app, you will prompted with the user authorization dialog:
This dialog allows the user to grant your app permission to access their information. If the user presses Allow, your app is authorized and you will have access to the user's profile and social graph through the facebook instance. If the user presses Don't Allow, your app is not authorized and you will not have access to the user's data.
By default, the user is asked to authorize the app to access basic information that is available publicly or by default on Facebook. If your app needs more than this basic information to function, you must request specific permissions from the user. This is accomplished by passing String[] of permissions to the authorize method. The following example shows how to ask for access to user's email address and their news feed:
facebook.authorize(this, new String[] { "email", "read_stream" },

      new DialogListener() {
           @Override
           public void onComplete(Bundle values) {}

           @Override
           public void onFacebookError(FacebookError error) {}

           @Override
           public void onError(DialogError e) {}

           @Override
           public void onCancel() {}
      }
);
A full list of permissions is available in our permissions reference. There is a strong inverse correlation between the number of permissions your app requests and the number of users that will allow those permissions. The greater the number of permissions you ask for, the lower the number of users that will grant them; so we recommend that you only request the permissions you absolutely need for your app.

Calling the Graph API

The Android SDK provides a straightforward set of methods to access the Graph API and the Legacy REST API:
// get information about the currently logged in user
facebook.request("me");               
//get the logged-in user's friends
facebook.request("me/friends");

//call a Legacy REST API method
Bundle parameters = new Bundle();
parameters.putString("method", "auth.expireSession");
String response = request(parameters);    
These methods are called synchronously and will block the UI, so we recommend that calling this in a separate thread and then marshal the results back to the UI thread. The Facebook SDK provides a class, AsyncFacebookRunner, that you can utilize for this purpose.

Displaying Platform Dialogs

The Android SDK provides the dialog method to display Platform Dialogs within the context of your app. Simply pass in the name of the dialog to display along with a delegate to handle the result. The following example displays the Feed Dialog:
facebook.dialog(this,"feed",

      new DialogListener() {
           @Override
           public void onComplete(Bundle values) {}

           @Override
           public void onFacebookError(FacebookError error) {}

           @Override
           public void onError(DialogError e) {}

           @Override
           public void onCancel() {}
      }
);


Mobile Web

The mobile web is an important and growing focus area for Facebook Platform. Most of our desktop web technologies apply to the mobile web, making Facebook for Websites is the best place to get started. The following sections highlight how to use the JavaScript SDK and our Platform Dialogs directly to handle user login and news feed publishing.

User Login

Because of the display limitations of mobile devices, Facebook Platform provides special support within our Platform Dialogs for user login on mobile devices. If you are using the our JavaScript SDK, the correct dialog for the user's device will be rendered automatically.
The JavaScript SDK requires that you register your website with Facebook to get an App ID (or appId). The appId is a unique identifier for your site that ensures that we have the right level of security in place between the user and your website. The following example shows how to load the JavaScript SDK using your appId and add the Login Button to your page using the <fb:login-button> XFBML element:
 <html>
    <head>
      <title>My Facebook Login Page</title>
    </head>
    <body>
      <div id="fb-root"></div>
      <script src="http://connect.facebook.net/en_US/all.js"></script>
      <script>
         FB.init({ 
            appId:'YOUR_APP_ID', cookie:true, 
            status:true, xfbml:true 
         });
      </script>
      <fb:login-button>Login with Facebook</fb:login-button>
    </body>
 </html>
When this page is loaded into your mobile browser it will render the login button. When the user selects the login button, they will be prompted to authenticate and authorize your site:

If you would rather use the OAuth Dialog directly, you can use the parameter display to specify that you would like to render a mobile version of the dialog. There are two options for display relevant to mobile web apps:
  • wap for feature phones and older mobile Web browsers
  • touch for smartphone and tablets with full featured Web browsers
To authenticate a user and have them authorize your site using the WAP-friendly OAuth Dialog, redirect the user to the following URL:
http://www.facebook.com/dialog/oauth?
    client_id=YOUR_APP_ID&redirect_uri=YOUR_URL&display=wap
For a touch view of the same dialog suitable for display in iOS and Android devices, specify the touch value in the display parameter:
http://www.facebook.com/dialog/oauth?
    client_id=YOUR_APP_ID&redirect_uri=YOUR_URL&display=touch

News Feed Publishing

As with user login, Facebook Platform provides special support within our Feed Dialog to enable mobile web apps to publish into the News Feed. The current version of the JavaScript SDK does not yet supporting automatically selecting the correct dialog for the user's device. We expect to add this capability shortly.
To display a mobile-friendly Feed Dialog, redirect the user to the following URL:
http://www.facebook.com/dialog/feed?
    client_id=YOUR_APP_ID&redirect_uri=YOUR_URL&display=touch

No comments:

Post a Comment