Willy's Fish教學筆記』

我們今天要在 app 中
加入 Facebook 登入的功能
以提升使用者 註冊 & 登入 的方便度

現在就讓我們照著官網教學步驟一步一步的前進吧 !

點我進官網教學

第一步就是要建立 App 的 ID 了
點進網頁之後，我們可以看到這個畫面

我們按右上方的 Skip and Create App ID 來建立
如果已經申請過，就直接在輸入框輸入即可

填入我們的 App Name

這樣就成功申請完成了
會進到 App 相關的設定頁面

由於我們這次要做的是 Facebook 登入
所以點擊 開始始用 會進到選擇平台頁面

進到 Android 之後
由於 Android Studio 是用 Gradle 來管理套件
所以我們跳到步驟2
到 build.gradle 裡面加入這段橘色的 code
位置需要在 dependencies 之前

apply plugin: 'com.android.application'

android {
   。。。
}

repositories {
    mavenCentral()
}

dependencies {
     。。。
}

然後在 dependencies 中加入 compile 'com.facebook.android:facebook-android-sdk:4.18.0'
後面的版本號碼，可能會不斷的更新
請盡量以現行的版本為主

dependencies {
    。。。
    compile 'com.facebook.android:facebook-android-sdk:4.18.0'
}

注意： Facebook Login 功能，只支援到  API 15： Android 4.0.3 以上的專案

完成後進行下一步
把需要的資訊填入後再進行下一步

這裡會跳出一個找不到名稱的錯誤
原因是我們還沒上架到 Google Play 
所以現在先 使用此封裝名稱 吧!

再來就是要取得 密鑰(Hash Key)
這裡 Mac 與 Windows 的指令不同

// Mac     
keytool -exportcert -alias androiddebugkey -keystore 
    ~/.android/debug.keystore | openssl sha1 -binary
    | openssl base64
// Windows       
keytool -exportcert -alias androiddebugkey -keystore
     %HOMEPATH%\.android\debug.keystore 
     | openssl sha1 -binary | openssl base64

上面的指令可以讓我們得到一組長度為 28 個字元的專屬密鑰雜湊
然後再貼入欄位即可進行下一步

這裡如果有人不想要用指令的話
其實用 code 也可以得到這組 Hash Key
好處是不分 Mac or Windows 皆可使用
點我了解更多

進行下一步
啟用單一登入

 

再來就是要在我們的專案裡設定 Facebook SDK 了
到 string.xml 裡，把剛剛申請的編號輸入

<string name="facebook_app_id">167486133766269</string>

然後記得開啟網路權限，在 Manifest 中加入

<uses-permission android:name="android.permission.INTERNET" />

還有 meta-data 元素

<application
   。。。
    <meta-data
        android:name="com.facebook.sdk.ApplicationId"
        android:value="@string/facebook_app_id" />
   。。。
</application>

設定的部份到這裡已經完成了
再來就是 code 要如何寫
才能與 Facebook 連動

請參考我們的下篇文章
Willy's Fish教學筆記』Android 如何讓自己的 App 整合 Facebook Sign In SDK，實作 login 功能教學 (實作篇)
 

資料來源：
https://developers.facebook.com/docs/facebook-login/android
https://developers.facebook.com/quickstarts/?platform=android