在設計會員制的手機遊戲時，弄一個社群登入是一個能方便玩家快速進入遊戲核心的一個方法，可以省下註冊 Key 資料的時間。
今天我要帶給各位的是 Facebook 最新的 v11 SDK 手機會員登入與伺服器端驗證的實作教學，如果你沒有伺服器需求的話可以只做完手機會員登入，那其他人就跟著我一步一步來完成它。
事前安裝
待會我們要開始將 Facebook SDK 匯入專案，匯入後他要建立一串 Key Hash 給 API 用，而因為這東西會動到 OpenSSL，所以我們必須先將它安裝好。
安裝後我們要手動設定環境變數，設定好變數後必須重開電腦，就是這原因我才會把這段寫在最前面。
OpenSSL For Windows：https://slproweb.com/products/Win32OpenSSL.html
這個版本的 OpenSSL 套件有分為 32/64 位元與 普通/Light 版本，對於一般用途，選用 64 位元 Light 版本就夠用，也就是下載安裝「Win64 OpenSSL v1.1.1L Light」。
開新專案
啟動 Unity HUB，開一個新專案。因為在這裡我們只會動到 UI，所以使用 2020.3.15 的 2D 樣板。
專案建立完成後，開啟 Build Settings，將 Platform 切換為 Android。切換完成後點擊左下角的 Player Settings… 開啟設定視窗。
展開 Other Settings，勾選 Override Default Package Name 後將 Package Name 改成你要的名稱。這步驟先做好，後面匯入 SDK 時就只要等待一次系統配置的時間。
匯入 Facebook SDK
到 Facebook 開發者文件中下載給 Unity 用的 Package，下載解壓縮後能得到一支名為 facebook-unity-sdk-11.0.0.unitypackage 的檔案。
Facebook SDK for Unity：https://developers.facebook.com/docs/unity
直接將 SDK 全部匯入 Unity。
如果有跳出 API Update Required 提示，選擇 I Made a Backup, Go Ahead!。
SDK 成功匯入後，Editor 將自動啟動 Resolving Android Dependencies 工作，等他跑完且顯示 Library processing complete 即可關掉它。
前面先改好 Package Name 就是為了讓他別再多跑一次這個工作，時間寶貴。
設定 Facebook 串接資料
從頂部選單的 Facebook > Edit Settings 開啟 Facebook Settings 內容。
現在我們應該要看到的狀況應該是：
- 有 Invalid App Id 錯誤警告。
- Android Build Facebook Settings 中無任何錯誤訊息。
如有其他狀況則需要一些手段來解決，有人遇到再來補充。
接下來要開始進行 Facebook 那邊的設定，現在請啟動你慣用網頁瀏覽器。
建立應用程式
前往 Facebook 所有應用程式網頁，點擊新增應用程式按鈕，開始進行設定。
Facebook 所有應用程式：https://developers.facebook.com/apps/
應用程式類型選擇「遊戲」。
輸入應用程式名稱後完成建立流程。
切換為上線模式
應用程式建立後預設模式為「調整中」，如需要切換成「上線」則要完成 隱私政策網址、用戶資料刪除 與 子類別 欄位的填入。
設定的位置在左側的 設定 > 基本資料。
儲存後，點擊應用程式類型旁的「調整中」，將它切換為上線模式。
填入 Facebook App Id
剛才設定基本資料的網頁中有個「應用程式編號」，將它複製貼上到前面打開的 Facebook Settings 的 Facebook App Id 欄位。
Invalid App Id 錯誤警告將消失。另外我們馬上要使用到 Android Build Facebook Settings 中的 Package Name、Class Name 與 Debug Android Key Hash 資料。
新增平台串接資訊
回到剛才的基本設定網頁，滑到最下面點擊「+ 新增平台」按鈕。
平台選擇「Android」。
Android Store 選擇「Google Play」。
最後你會得到一個新的空表單，這時請依序填入前面提到的 Package Name、Class Name 與 Debug Android Key Hash 三筆資料。
在填入套件名稱時會顯示 There was a problem verifying this package name. Please check and try again. 錯誤訊息，這是 BUG，全部填完後直接存檔就好，不用理他。
感動吧！基礎設定都完成了，接下來將要開始寫程式。
建立 SDK 控制腳本
我們先完成客戶端的 Facebook 登入功能後再來管伺服器資料驗證，基本上多為 Copy & Past 的作業。
首先建立一個名為 FacebookController 的腳本，再將 Facebook 官方提供的初始化腳本複製貼上。就是填入下面附的這個連結中的 Initialize the SDK 的 Code。
Unity SDK Example：https://developers.facebook.com/docs/unity/examples
最後看起來會長這樣，直接複製貼上我的也行：
建立登入按鈕功能
這邊一樣是 Copy & Past 的工作。首先在 FacebookController 類別下新增一個公開方法，可取名為 OnLoginBtnClick，再將官方範例中的 Facebook Login 段落的前兩行 Code 放進去。
這邊再貼一次文檔連結：
Unity SDK Example：https://developers.facebook.com/docs/unity/examples
完成按鈕的方法後，再將官方範例剩下的 Code 貼在 OnLoginBtnClick 下面。
到這裡，客戶端登入的程式碼就撰寫完成，我們先來弄個簡單的登入按鈕。
在場景中新增一個 Canvas 與 Button，將 FacebookController 拉進去後設定點擊事件觸發 OnLoginBtnClick。這邊的是很基礎的操作，就不細講。
設定完後來做個客戶端登入的測試。
測試客戶端登入功能
在 Editor 播放，並按下登入按鈕後他會彈出這個模擬登入的介面。這東西是讓你能在 Editor 中快速測試的功能，免得每次都要等待編譯 APK 的時間。
他的用法很簡單，流程如下：
- 點擊 Find Access Token 開啟網頁，登入帳號並取得 Token。
- 將 Token 複製貼上至 User Access Token 欄位。
- 按下 Send Success 按鈕後成功登入。
第一次來要 Token 時，User Token 欄位會有個「需要提供權限」的連結，點開後他會帶你到圖形 API 測試工具網頁。
先確認一下「Facebook 應用程式」與「用戶或粉絲專頁」的值是否與下圖類似，是的話就放心點擊 Generate Access Token 按鈕。
完成資料授權。
將取得的 Token 複製下來。
最後將 Token 貼上到 Unity 後按下 Send Success，就可以完成帳號登入並在 Console 中找到你的使用者 ID。
剛才的存取權杖工具在完成這一次的資料授權後，以後開啟網頁後會直接顯示 Token，就不用再開啟圖形 API 測試工具。
到這裡已經完成客戶端登入的功能。如果你想，也可以在這邊就先 Build 一版到手機裡，理論上是可以正常調用 Facebook API 並成功登入。
那麼接下來即將要實作並整合現有客戶端登入的「伺服器端驗證」功能，這邊將使用 XAMPP 來建一個簡易網頁伺服器，並搭配 PHP 來進行後端處理。XAMPP 的安裝將直接略過，請自行完成安裝後再進行下一步驟。
建立伺服器端驗證程式
先啟動 XAMPP 的 Apache 伺服器，並在 C:\xampp\htdocs 下新增一個 login.php 檔案，將以下程式碼複製貼上。
簡單解釋一下，這支 PHP 會先偵測說你用 POST 傳入的 Token 是否存在，存在的話就會把他丟給 Facebook 伺服器來取得這個 Token 代表的真實帳戶 ID 和名稱。
中間的 graph.fb.gg 這串所對應的 API 可以在先前我們有用過的圖形 API 測試工具中取得，點擊「取得代碼」按鈕可以拿到幾種程式語言的語法，你可以自行嘗試各種不同的 API 用法。
圖形 API 測試工具：https://developers.facebook.com/tools/explorer/
剛才這隻 PHP Script 最終會把從 Facebook 伺服器取得的帳戶 ID 與名稱直接 Print 出來，這時伺服器就可以拿帳戶 ID 來向資料庫那邊做撈資料等作業。但這一塊現在也直接略過 (不是重點)，我們就直接將 PHP Print 出來的資料顯示在 Unity 的 UI 中。
新增手機登入後發送與接收資料功能
回到 Unity，先 using 兩項命名空間：
再將以下程式碼複製貼上到 FacebookController 下：
這段程式碼就是一個基礎的發送 POST 至 login.php 的功能並顯示到 Text UI 上，基礎功能就不多做贅述。(IP 記得要改成你伺服器的)
最後完成的結果如下圖，登入成功後在 Text UI 上就會顯示「我的伺服器」從「Facebook 伺服器」上抓到的帳戶資料。
最後的完整 FacebookController.cs 長這樣，七八成都是複製貼上來著：