2018年4月27日 星期五

20180502 Facebook 的登入與基本權限

I 前置作業(Android Studio 設定 + Facebook SDK)

1.使用 Maven 來下載設定相關函式庫

build.gradle(專案)
程式碼:
repositories {
       jcenter()
}

build.gradle(app) 
程式碼:
implementation 'com.facebook.android:facebook-login:[4,5)' 

如下圖所示:

2.設定應用程式,以便得到應用程式編號並設定在 string.xml 

如下圖所示:

3.將應用程式與您的套件名稱和預設類別建立連結並填入每台電腦的開發金鑰

至 Facebook 開發者網站,選取已經建立好的應用程式,如還沒建立可先行建立一個
如下圖所示:
至文件開啟新手指南 Android SDK
如下圖所示:
找到快速入門點擊進入。
如下圖所示:
尋找已經建立好的專案,點擊並進入。
如下圖所示:
輸入「包裝名稱」與「預設活動類別名稱」,可至 Android Studio 查看。
如下圖所示:
至 Android Studio 內的 java 檔查看「包裝名稱」與「預設活動類別名稱」。
如下圖所示:
按下「下一步」後,會出現以下對話框,提示驗證發生問題,請暫時忽略,請直接選取「使用此封裝名稱」,原因為在建立專案時,使用com.example...的關係。
如下圖所示:
輸入金鑰雜湊,如是 Windows 作業系統,請至命令提示字元取得金鑰。
如下圖所示:
於命令提示字元輸入以下程式碼
程式碼:
keytool -exportcert -alias androiddebugkey -keystore %HOMEPATH%\.android\debug.keystore | openssl sha1 -binary | openssl base64
如下圖所示:
此時會要求輸入金鑰儲存庫密碼,請返回至 Android Studio 取得。
如下圖所示:
依照以下指示取得金鑰儲存庫密碼。
如下圖所示:
輸入金鑰儲存庫密碼後,按下 Enter ,會出現金鑰雜湊,請複製。
如下圖所示:
返回至 Facebook 開發者網頁的快速入門,將金鑰雜湊填入後,點擊下一步,即可順利將 Facebook SDK 新增到專案。
如下圖所示:

II 新增登入按鈕

1.AndroidManifest.xml 檔案-在application 元素後方加入

uses-permission 元素
如下圖所示:
facebook 應用程式編號
使用 facebook 程式
chrome 頁籤(TAB) 
等活動(activity)與篩選器(filter)
如下圖所示:

2.在 layout 檔中擺放登入按鈕

程式碼:
<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" 
/> 
如下圖所示:

3.在 MainActivity.java 或是任何 activity 完成以下程式

先設定好要使用的欄位
程式碼:
LoginButton loginButton;
CallbackManager callbackManager;
// FB 要用的常見欄位

在 OnCreate 中進行初始化
程式碼:
callbackManager = CallbackManager.Factory.create();
loginButton = (LoginButton) findViewById(R.id.login_button);
loginButton.setReadPermissions("email"); 

如下圖所示:
按下登入按鈕 loginButton 時必須考慮登入的結果:成功或失敗(或是無法預期的錯誤..),所以要註冊回呼(callback)的機制(一般來說也是在 onCreate 時進行) 由於相關程式可能很長,所以寫在registerFacebook()方法 
如下圖所示:
建立onActivityResult 方法來呼叫回呼結果(CODE-Override Method) 

所有與FB 有關的activity 應該都要透過callbackManager 來紀錄回呼權限,所以都要上述onActivityResult 的方法 

如下圖所示:

4.在專案中檢查是否登入成功或是目前登入狀態

一旦登入成功,FB應用程式會透過上圖的『LoginResult loginResult』註冊一個SharedPreference,loginResult 裡會有註冊的狀態和新增或取消的相關權限

5.客製化登入按鈕(補充)

如果要客製化登入按鈕,就使用普通的 Button 或是 ImageButton 等。
如下圖所示:
有些權限只需要讀取,如
Arrays.asList("public_profile") // 公開的個人檔案 Arrays.asList("user_status") // 使用者狀態 
Arrays.asList("email ") // 使用者email 通常也是帳號呼叫方式
LoginManager.getInstance().logInWithReadPermissions(Activity 的名稱.this, Arrays.asList("email"));

有些需要寫入或是 publish 
LoginManager.getInstance().logInWithPublishPermissions(fragmentOrActivity, Arrays.asList("publish_actions"));

取得目前同意的所有權限
AccessToken.getCurrentAccessToken().getPermissions(); 
取得目前拒絕的所有權限
AccessToken.getCurrentAccessToken().getDeclinedPermissions();

如下圖所示:

6.建立測試人員

此時返回至 Facebook 開發人員網頁,並前往應用程式專案頁面。注意!你需要 fbid 或 username。
如下圖所示:

7.結果





沒有留言:

張貼留言