章節連結
方前在網頁開發時,說要做個使用者登入介面串接,那最方便的選擇非 OAuth 2 的技術了。不過 Google, Facebook 和 Github 的設定頁面有些難尋,於是在這邊筆記一下。
OAuth2 申請頁面
開發者首頁:https://developers.facebook.com/
首先,點選右上角的「我的應用程式」裡的「建立應用程式」。然後輸入應用程式名稱和Email,然後點選「建立」。
接著會進入到應用程式的儀表板,點選左邊的設定,並點開裡面的基本資料。在這邊你可以得到應用程式的編號和密碼(請勿將這兩組資料放在網路上供他人下載或得知。)
若要實作登入功能,點選左下角的「Facebook」登入,裡面的設定選項,並在裡頭輸入 Callback 的網址。不過這 Callback 的網址,有一定的要求如下:
1. Facebook 目前採取嚴格的 callback 網址格式 <your domain>/auth/facebook/callback
如:https://www.yourdomain.com/auth/facebook/callback。當 callback 的格式不對,那麼 Facebook 就不會回傳授權成功的指令。
2. Localhost 本機端的認證 callback 網址,只要符合格式即可。 Facebook 並不會儲存 localhost 的設定值,而是預設它只要符合格式就可以過關。
Github
身為開發員常用的 Github,OAuth 的應用程式設定是在個人的設定頁面左下角,有一個 Developer Setting。
點選 OAuth Apps,並建立一個 New OAuth App。
輸入應用程式名稱、Homepage 的 URL、Callback 的網址,這樣就可以取得授權了。
點選左下角的 Register Application 後,你可以看到 Client ID 和 Secret 。一樣的,請勿在網路上公布這些資料。
開發者首頁:https://cloud.google.com/
若無專案,請先開啟一個新專案。
點選左方的導覽選單內,你可以找到「憑證」選項。
接著,你會看到 OAuth 同意畫面,並在裡面填入相關的設定:主要是在「已授權網域」這邊,填入 Domain 的位置即可,/後方的資訊都不用輸入。