2017年3月5日 星期日

Facebook SDK + android studio

(★已於03月25日更新★)


Part 1 - (03/09)

許多社群帳號或是知名入口網站都提供了帳號驗證,提供第三方APP進行帳號管理之用,優點是使用者無需記憶太多帳號密碼,只需要記憶入口網站即可,對於使用者便利性提升;缺點則是對於第三方APP來說,我們必須跟Facebook(或其他的帳號提供者)分享使用者資料。

一、建立一個專案然後使用Facebook SDK

  1. 前往Android Studio | 新增專案(New Project)
  2. 選擇API23:Android 6.0
  3. 建立完專案後,將Project 結構的視角切換到「Project」,並找到「build.gradle」。
  4. 在「dependencies」加入 Facebook SDK 最新版本的編輯相依性。
  5. 建置專案(Make Project)
repositories {
        mavenCentral()
    }
'com.facebook.android:facebook-android-sdk:4.+'



二、申請Facebook應用程式編號

  1. 前往以下網址申請應用程式編號:
    https://developers.facebook.com/quickstarts/?platform=android


三、加入Facebook 應用程式編號

將你剛剛申請好的應用程式編號加入至專案,並新增權限至 Manifest 檔案
  1. 開啟 strings.xml 檔案,加入一個新字串,名稱是 facebook_app_id,值則是您剛剛申請的應用程式編號。

  2. 調整 Manifest ,新增網路權限。
    <uses-permission android:name="android.permission.INTERNET"/> 
  3. 在標籤<application>中新增 meta-data 標籤。
    <meta-data android:name="com.facebook.sdk.ApplicationId" android:value="@string/facebook_app_id"/>
  4. 【Option】若要發送圖片、影片或是分享,必須宣告FacebookContentProvider 將應用程式編號附加到 authorities 值的結尾。
    <provider    android:authorities="com.facebook.app.FacebookContentProvider你的應用程式編號"    android:name="com.facebook.FacebookContentProvider"    android:exported="true"/>


【測試】

現在你可以在 MainActivity.JAVA 中新增「import com.facebook.FacebookSdk;」,
然後建置專案看看是否可以正常執行。


四、繼續完成 Facebook 開發者快速入門

  1. 回到以下網址:
    https://developers.facebook.com/quickstarts/你的應用程式編號/?platform=android

  2. 尋找你的 hashes ,每一台電腦都不一樣,貼上金鑰後就完成了。



【延伸】

找不到 hashes ?



Part 2 - (03/25)

我們使用「Facebook SDK」最主要的目的就是登入應用程式。當使用 Facebook 登入應用程式,使用者將權限『授權』給應用程式,所以我們可以擷取資訊或代表用戶在 Facebook 上執行動作。至於登入的畫面與方式,如果使用者有安裝 Facebook  APP ,那麼會使用 Facebook  APP 進行帳號驗證;然而如果使用者並未安裝,則登入畫面會使用 Facebook  Lite 的頁面。

一、啟用單一登入

要使用 Facebook 登入功能,在完成 Facebook 應用程式 ID 申請後,我們需要把『單一登入』的功能開啟。
  1. 前往以下網址:
    https://developers.facebook.com/apps/你的 FB 應用程式編號/settings/basic/
  2. 將最下方『Android』區塊的『單一登入』項目改為『』。
  3. 完成以後記得『儲存變更』。

二、新增登入按鈕

登入按鈕必須要使用特殊的 LinkButton ,是 FB 所提供的客製化 Button 。
  1. 在恰當的介面 layout 的 xml 中,加上這個按鈕:
    <com.facebook.login.widget.LoginButton    android:id="@+id/login_button"    android:layout_width="wrap_content"    android:layout_height="wrap_content"    android:layout_gravity="center_horizontal"    android:layout_marginTop="30dp"    android:layout_marginBottom="30dp" />

  2. 完成後,你會得到一個這樣的按鈕:

使用 LoginButton ,我們可以一併用到以下 SDK 提供的類別:
  • LoginManager:使用要求的讀取或發布權限起始登入程序。
  • CallManager:用於將呼叫傳回至 Facebook SDK 以及您的已註冊回呼。應該從起始活動 activity 或片段 fragment 的 onActivityResult 呼叫此函數。
  • AccessToken:使用此類型的圖形 API 要求(GraphAPI)。它會顯示用戶編號及被接受和被拒絕的權限。
  • Profile:此類別具有已登入用戶的基本資訊。

LoginButton 是套件 LoginManager 中可的 UI 控制項。使用者點擊這個按鈕時,將會以 LoginManager 中設定的權限初始化登入。此按鈕會追蹤登入狀態,並根據用戶的驗證狀態顯示正確的文字。

三、增加程式部分

由於目前的 APP 使用 Fragment 設計居多,所以 FB 開發者教學裡是以 Fragment 為主要教學方式。
  1. activity 的欄位裡設定:
    CallbackManager callbackManager;
    AccessToken accessToken;
  2. 介面對應的 Activity 中, onCreate 的方法裡,要初始化 FacebookSdk
    FacebookSdk.sdkInitialize(getApplicationContext());
  3. 建立 CallbackManager
    //宣告 callbackManagercallbackManager = CallbackManager.Factory.create();
  4. 連結程式與 layout 的 LinkButton,並設定當 LoginButton 收到回傳(callback)的處理動作:成功、失敗、取消。如果登入成功,APP 會收到一組 AccessToken (剛剛程式裡的欄位變數 accessToken),之後要用到 graphAPI 的地方都用這組 token。接著送一個 request 出去,在 onCompleted 裡面會拿到一個傳入變數 JSONObject (變數名稱是 object),包裹著使用者資訊(name 使用者姓名、link 個人頁面、id)。
    (注意括弧和分號的位置,不要輸入錯誤囉!)
    //找到 login buttonfinal LoginButton loginButton = (LoginButton) findViewById(R.id.login_button);
    loginButton.registerCallback(callbackManager,
            new FacebookCallback<LoginResult>() {
                //登入成功            @Override            public void onSuccess(LoginResult loginResult) {
                    //之後也許還會用到,先存起來                accessToken = loginResult.getAccessToken();
                    //send request and call graph api                GraphRequest request = GraphRequest.newMeRequest(
                            accessToken,
                            new GraphRequest.GraphJSONObjectCallback() {
                                //當RESPONSE回來的時候                            @Override                            public void onCompleted(JSONObject object, GraphResponse response) {
                                    //讀出姓名ID FB 人網頁連結                                Log.d("FB" , "complete");
                                    Log.d("FB" , object.optString("name"));
                                    Log.d("FB" , object.optString("link"));
                                    Log.d("FB" , object.optString("id"));
                                }});
                    //包入你想要得到的資料,送出 request                Bundle parameters = new Bundle();
                    parameters.putString("fields" , "id,name,link");
                    request.setParameters(parameters);
                    request.executeAsync();
                }
                //登入取消            @Override            public void onCancel() {
                    Log.d("FB" , "CANCEL");
                }
                //登入失敗            @Override            public void onError(FacebookException exception) {
                    Log.d("FB" , exception.toString());
                }
            });



【網址】

沒有留言:

張貼留言