--- title: 如何設定第三方登入？Google/Facebook/LINE description: 輕鬆整合第三方登入：Google、Facebook、LINE，讓您的網站登入體驗更便捷！ --- [跳到內容](https://help.kolable.com/migration/zh-tw/learn/settinglogingooglefacebookline#main-content) 中文 - 繁體 顯示翻譯的子功能表 [客戶入口網站](https://help.kolable.com/support?hsLang=zh-tw) ![kolable\_logo.png\]](https://help.kolable.com/hs-fs/hubfs/kolable_logo.png?height=40&name=kolable_logo.png) 開啟主要導覽 關閉主要導覽 - 中文 - 繁體 顯示翻譯的子功能表 - [客戶入口網站](https://help.kolable.com/support) 你需要哪方面的協助？ - 搜尋欄位為空，無法提供建議。 1. [Learn KOLABLE](https://help.kolable.com/migration/zh-tw/learn?hsLang=zh-tw) 2. [教學手冊](https://help.kolable.com/migration/zh-tw/learn/%E6%95%99%E5%AD%B8%E6%89%8B%E5%86%8A?hsLang=zh-tw) 3. [開始建立 Edit](https://help.kolable.com/migration/zh-tw/learn/%E6%95%99%E5%AD%B8%E6%89%8B%E5%86%8A?hsLang=zh-tw#%E9%96%8B%E5%A7%8B%E5%BB%BA%E7%AB%8B-edit) # 如何設定第三方登入？Google/Facebook/LINE ## 輕鬆整合第三方登入：Google、Facebook、LINE，讓您的網站登入體驗更便捷！ ### 【文章目錄】 [📍Google 登入設定步驟](https://help.kolable.com/migration/zh-tw/learn/settinglogingooglefacebookline#Part1) - [第一步：專案設定](https://help.kolable.com/migration/zh-tw/learn/settinglogingooglefacebookline#part1-1) - [第二步：OAuth 同意畫面設定](https://help.kolable.com/migration/zh-tw/learn/settinglogingooglefacebookline#Part1-2) - [第三步：憑證設定](https://help.kolable.com/migration/zh-tw/learn/settinglogingooglefacebookline#Part1-3) [📍Facebook 登入設定步驟](https://help.kolable.com/migration/zh-tw/learn/settinglogingooglefacebookline#Part2) - [第一步：建立應用程式](https://help.kolable.com/migration/zh-tw/learn/settinglogingooglefacebookline#part2-1) - [第二步：Facebook 登入【設定】](https://help.kolable.com/migration/zh-tw/learn/settinglogingooglefacebookline#part2-2) - [第三步：設定【基本資料】](https://help.kolable.com/migration/zh-tw/learn/settinglogingooglefacebookline#part2-3) - [第四步：應用程式審查【權限和功能】](https://help.kolable.com/migration/zh-tw/learn/settinglogingooglefacebookline#part2-4) [📍LINE 登入設定步驟](https://help.kolable.com/migration/zh-tw/learn/settinglogingooglefacebookline#part3) ### 📍**Google 登入設定步驟** ### **第一步：專案設定** 1\. 登入 [Google Cloud Platform](https://console.cloud.google.com/) 。若初次使用，請勾選服務條款，點選『 同意並繼續 』。 ![](https://help.kolable.com/hs-fs/hubfs/image-png-Aug-21-2023-01-13-06-1108-PM.png?width=460&height=238&name=image-png-Aug-21-2023-01-13-06-1108-PM.png) 2\. 於【資訊主頁】，點選「 選取專案 」，並接著點選「新增專案 」。 ![](https://help.kolable.com/hs-fs/hubfs/image-png-Aug-21-2023-01-13-27-0792-PM.png?width=460&height=233&name=image-png-Aug-21-2023-01-13-27-0792-PM.png) ![](https://help.kolable.com/hs-fs/hubfs/image-png-Aug-21-2023-01-15-11-9418-PM.png?width=460&height=239&name=image-png-Aug-21-2023-01-15-11-9418-PM.png) 3\. 於【新增專案】頁面填寫專案名稱， 並點選「建立」。 ![](https://help.kolable.com/hs-fs/hubfs/image-png-Aug-21-2023-01-18-29-3126-PM.png?width=460&height=348&name=image-png-Aug-21-2023-01-18-29-3126-PM.png) ### 第二步：OAuth 同意畫面設定 1\. 於【資訊主頁】左方列表中，點選「API 和服務」，展開後再點選「OAuth 同意畫面」。 ![](https://help.kolable.com/hs-fs/hubfs/image-png-Aug-21-2023-01-19-47-3048-PM.png?width=560&height=286&name=image-png-Aug-21-2023-01-19-47-3048-PM.png) 2\. 於【OAuth 同意畫面】選擇「外部」，並按下「建立」按鈕。 ![](https://help.kolable.com/hs-fs/hubfs/image-png-Aug-21-2023-01-22-23-1871-PM.png?width=560&height=284&name=image-png-Aug-21-2023-01-22-23-1871-PM.png) 3\. **編輯應用程式註冊申請**步驟（1）：OAuth同意畫面 > 建立後請在**應用程式資訊**區塊填寫「應用程式名稱」與「使用者支援電子郵件」。 > > ![](https://help.kolable.com/hs-fs/hubfs/image-png-Aug-21-2023-01-23-57-7011-PM.png?width=560&height=285&name=image-png-Aug-21-2023-01-23-57-7011-PM.png) > > 在**授權網域**填寫「網域」，於**開發人員聯絡資訊**填寫「開發人員電子郵件」，確認無誤並點選「儲存並繼續 」。 > > ![](https://help.kolable.com/hs-fs/hubfs/image-png-Aug-21-2023-01-26-32-0160-PM.png?width=560&height=288&name=image-png-Aug-21-2023-01-26-32-0160-PM.png) 4\. **編輯應用程式註冊申請**步驟（2）、（3）：範圍、測試使用者 > 設定皆毋須更改，點選「儲存並繼續」。 > > ![](https://help.kolable.com/hs-fs/hubfs/image-png-Aug-21-2023-01-33-28-6461-PM.png?width=560&height=324&name=image-png-Aug-21-2023-01-33-28-6461-PM.png) > > ![](https://help.kolable.com/hs-fs/hubfs/image-png-Aug-21-2023-01-35-17-6857-PM.png?width=560&height=284&name=image-png-Aug-21-2023-01-35-17-6857-PM.png) 5\. **編輯應用程式註冊申請**步驟（4）：摘要 確認註冊資訊無誤。 ![](https://help.kolable.com/hs-fs/hubfs/image-png-Aug-22-2023-10-38-20-7839-AM.png?width=560&height=322&name=image-png-Aug-22-2023-10-38-20-7839-AM.png)   ### 第三步：憑證設定 1\. 點選左方列表中「憑證」。 ![](https://help.kolable.com/hs-fs/hubfs/image-png-Aug-21-2023-01-37-58-0631-PM.png?width=560&height=320&name=image-png-Aug-21-2023-01-37-58-0631-PM.png) 2\. 於上方列表點選「＋建立憑證」，展開後再點選「OAuth 用戶端 ID」。 ![](https://help.kolable.com/hs-fs/hubfs/image-png-Aug-21-2023-01-44-58-8408-PM.png?width=560&height=285&name=image-png-Aug-21-2023-01-44-58-8408-PM.png) 3\. 於**應用程式類型**欄位選擇「網頁應用程式」。 ![](https://help.kolable.com/hs-fs/hubfs/image-png-Aug-22-2023-10-28-21-7494-AM.png?width=560&height=295&name=image-png-Aug-22-2023-10-28-21-7494-AM.png) 4\. 於**已授權的重新導向 URI** 區塊，在 **URI** 欄位填寫 URI，確認無誤後按下「建立」按鈕 。 URI 輸入下方網址： https://您的網域名稱/oauth2 ![](https://help.kolable.com/hs-fs/hubfs/image-png-Aug-22-2023-10-34-55-1808-AM.png?width=560&height=313&name=image-png-Aug-22-2023-10-34-55-1808-AM.png) 5\. 建立成功後，會跳出【OAuth 用戶端已建立】視窗，請複製**您的用戶端 ID**， 回到【網站後台\>網站管理\>參數設定】視窗， 搜尋 **auth.google\_client\_id** 寫上 **您的用戶端 ID** 值， 點擊儲存，網站便能正確使用Google 第三方登入。 ![](https://help.kolable.com/hs-fs/hubfs/image-png-Aug-22-2023-10-35-59-0348-AM.png?width=560&height=287&name=image-png-Aug-22-2023-10-35-59-0348-AM.png) ![](https://help.kolable.com/hs-fs/hubfs/image-png-Nov-01-2023-09-51-25-1151-AM.png?width=688&height=382&name=image-png-Nov-01-2023-09-51-25-1151-AM.png)   到此，已完成Google第三方登入用戶端的設定，感謝您的操作與配合。 ➡️ 返回[【文章目錄】](https://help.kolable.com/migration/zh-tw/learn/settinglogingooglefacebookline#content) ### 📍**Facebook 登入設定步驟** ### 第一步：建立應用程式 1\. 點擊網址 [https://developers.facebook.com/](https://developers.facebook.com/) 若尚未註冊 Meta for Developers ，請先完成註冊。 登入後點選「建立應用程式」按鈕。 ![](https://help.kolable.com/hs-fs/hubfs/image-png-Aug-22-2023-10-54-43-3420-AM.png?width=560&height=250&name=image-png-Aug-22-2023-10-54-43-3420-AM.png) 2\. 於**類型**頁面，選擇「企業商家」並點選「繼續」。 ![](https://help.kolable.com/hs-fs/hubfs/image-png-Aug-22-2023-10-57-18-3672-AM.png?width=560&height=464&name=image-png-Aug-22-2023-10-57-18-3672-AM.png) 3\. 於**詳細資料**頁面，確認設定無誤並點選「繼續」。 ![](https://help.kolable.com/hs-fs/hubfs/image-png-Aug-22-2023-11-13-28-6178-AM.png?width=560&height=239&name=image-png-Aug-22-2023-11-13-28-6178-AM.png) ### 第二步：Facebook 登入【設定】 1\. 在**為應用程式新增產品**區塊，選擇**商家專用 Faceboook 登入**的卡片點擊「設定」按鈕。 ![](https://help.kolable.com/hs-fs/hubfs/image-png-Aug-22-2023-11-56-17-6170-AM.png?width=560&height=330&name=image-png-Aug-22-2023-11-56-17-6170-AM.png) 2\. 於**有效的 OAuth 重新導向 URI** 區塊，輸入 URI  。 URI 輸入下方兩個網址： https://您的網域名稱/oauth2/facebook https://您的網域名稱/oauth2/ ![](https://help.kolable.com/hs-fs/hubfs/image-png-Aug-22-2023-12-03-37-2935-PM.png?width=560&height=280&name=image-png-Aug-22-2023-12-03-37-2935-PM.png) 3\. 於**取消授權回呼網址**區塊，新增下方一個網址，確認無誤後按下「儲存變更」按鈕。 取消授權回呼網址格式：https://您的網域名稱 ![](https://help.kolable.com/hs-fs/hubfs/image-png-Aug-22-2023-12-09-27-6890-PM.png?width=560&height=129&name=image-png-Aug-22-2023-12-09-27-6890-PM.png) ### 第三步：設定【基本資料】 1\. 於**基本資料**頁面設定以下資訊： ( 1 ) **顯示名稱**：填入你的網站名稱（例如：Kolable） ( 2 ) **應用程式網域**：填入你的網域名稱（例如網址為https://support.kolable.app/blog ， 網域名稱則為「support.kolable.app」） ( 3 ) **聯絡電子郵件**：填入公司或您的聯絡電子郵件 ( 4 ) **隱私政策網址**、**服務條款網址**：填入 「 https://您的網域名稱/terms 」 ![](https://help.kolable.com/hs-fs/hubfs/image-png-Aug-22-2023-12-22-02-5801-PM.png?width=560&height=280&name=image-png-Aug-22-2023-12-22-02-5801-PM.png) 2\. 點選**應用程式圖示**，可上傳公司圖示，圖片大小請參照 Facebook 建議尺寸。 ![](https://help.kolable.com/hs-fs/hubfs/image-png-Aug-22-2023-12-29-01-6131-PM.png?width=560&height=229&name=image-png-Aug-22-2023-12-29-01-6131-PM.png) 3\. 於**商家驗證**區塊，點選「開始驗證」。 商家驗證：是指企業管理平台通過 Facebook 人工審核，需要附上地址、電話等相關營業資訊。如果有進行廣告投放的企業較容易通過，個人帳號較不易通過。 後續商家驗證上如有產生其他問題，可與Facebook客服人員諮詢或參考[此文章](https://www.facebook.com/business/help/2058515294227817?id=180505742745347)。 ![](https://help.kolable.com/hs-fs/hubfs/image-png-Aug-22-2023-12-30-29-9294-PM.png?width=560&height=249&name=image-png-Aug-22-2023-12-30-29-9294-PM.png) 4\. 商家驗證成功後，捲動頁面至下方點擊「+新增平台」，並勾選「Website」後，點選「下一步」。 ![](https://help.kolable.com/hs-fs/hubfs/image-png-Aug-22-2023-12-37-02-6192-PM.png?width=560&height=286&name=image-png-Aug-22-2023-12-37-02-6192-PM.png) ![](https://help.kolable.com/hs-fs/hubfs/image-png-Aug-22-2023-12-35-48-0592-PM.png?width=560&height=325&name=image-png-Aug-22-2023-12-35-48-0592-PM.png) 5\. 於新增**網站**區塊中，輸入**網站網址**，並點選「儲存變更」。 ![](https://help.kolable.com/hs-fs/hubfs/image-png-Aug-22-2023-12-38-20-9555-PM.png?width=560&height=248&name=image-png-Aug-22-2023-12-38-20-9555-PM.png) ### 第四步：**應用程式審查**【**權限和功能**】 搜尋 **public\_profile** 與 **email**，將其開啟**存取權限**。 此步驟須完成「[商家驗證](https://help.kolable.com/migration/zh-tw/learn/settinglogingooglefacebookline#business_verification)」。 ![](https://help.kolable.com/hs-fs/hubfs/image-png-Aug-22-2023-12-49-20-4513-PM.png?width=560&height=325&name=image-png-Aug-22-2023-12-49-20-4513-PM.png) 待以上設定皆完成後，取得**應用程式編號**，回到【網站後台\>網站管理\>參數設定】視窗， 搜尋 **auth.facebook\_app\_id** 寫上 **應用程式編號**值， 點擊儲存，網站便能正確使用 Facebook 第三方登入。 ![](https://help.kolable.com/hs-fs/hubfs/image-png-Aug-22-2023-12-57-38-7466-PM.png?width=560&height=219&name=image-png-Aug-22-2023-12-57-38-7466-PM.png) ![](https://help.kolable.com/hs-fs/hubfs/image-png-Nov-01-2023-10-02-01-2801-AM.png?width=688&height=351&name=image-png-Nov-01-2023-10-02-01-2801-AM.png) 到此，已完成 Facebook 第三方登入用戶端的設定，感謝您的操作與配合。 建立完成應用程式後，務必固定一段時間檢查「資料使用情形審查」，詳情請參考**[Facebook Developers 資料使用情形審查](https://support.kolable.app/posts/b1d8cadc-97bc-480d-930b-14e1dffa8254)**說明文件。 ➡️ 返回[【文章目錄】](https://help.kolable.com/migration/zh-tw/learn/settinglogingooglefacebookline#content) ### 📍LINE **登入設定步驟** 若尚未註冊 LINE 開發者帳號，先**[點此](https://support.kolable.app/posts/9a7e992d-aba1-4707-823e-f771bc19ab2e)**教學文件建立開發者帳號。 若已有開發者帳號，可繼續下方步驟🌟 1\. 請先進到 [LINE 管理後台](https://developers.line.biz/console/)，並使用「商用帳號」登入。 2\. 於 Channels 頁籤點選「Create a new channel」 ，如已有開設「LINE Login」可直接到步驟4. ![](https://help.kolable.com/hs-fs/hubfs/image-png-Aug-22-2023-01-10-25-2431-PM.png?width=560&height=286&name=image-png-Aug-22-2023-01-10-25-2431-PM.png) 3\. 於 **Create a channel** 視窗，選擇「LINE Login」。 ![](https://help.kolable.com/hs-fs/hubfs/image-png-Aug-22-2023-01-06-35-3505-PM.png?width=560&height=280&name=image-png-Aug-22-2023-01-06-35-3505-PM.png) 4\. 新增官方帳號後，於 Channel 頁籤點擊該卡片。 ![](https://help.kolable.com/hs-fs/hubfs/image-png-Aug-22-2023-01-11-03-4148-PM.png?width=560&height=283&name=image-png-Aug-22-2023-01-11-03-4148-PM.png) 5\. 於 Basic settings 頁籤中，找尋以下兩個值， 回到【網站後台\>網站管理\>參數設定】視窗，搜尋 **auth.line\_client\_id** 寫上 **Channel ID** 值，**auth.line\_client\_secret** 寫上 **Channel secret** 值點擊儲存 **( 1 ) Channel ID** **( 2 ) Channel secret** ![](https://help.kolable.com/hs-fs/hubfs/image-png-Aug-22-2023-01-13-24-5121-PM.png?width=560&height=688&name=image-png-Aug-22-2023-01-13-24-5121-PM.png) ![](https://help.kolable.com/hs-fs/hubfs/image-png-Nov-27-2023-11-05-00-1567-AM.png?width=688&height=115&name=image-png-Nov-27-2023-11-05-00-1567-AM.png) 6\. 於 LINE Login頁籤中，**Callback URL**欄位輸入「https://您的網域名稱/oauth2」，並點選「Update」。 ![](https://help.kolable.com/hubfs/image-png-Aug-22-2023-01-19-22-6651-PM.png) 7\. 回到 Basic settings 頁籤，於 OpenID Connect區塊，點選「Apply」，此操作將會索取使用者 Email 的權限。 完成申請後，同位置將會顯示「Applied」。 ![](https://help.kolable.com/hs-fs/hubfs/image-png-Aug-22-2023-01-22-03-3036-PM.png?width=560&height=185&name=image-png-Aug-22-2023-01-22-03-3036-PM.png) ![](https://help.kolable.com/hs-fs/hubfs/image-png-Aug-22-2023-01-23-26-5578-PM.png?width=560&height=264&name=image-png-Aug-22-2023-01-23-26-5578-PM.png) 8\. 以上步驟皆設定完成後，請點選發布狀態，將「Developing」改為「Published」。 ![](https://help.kolable.com/hs-fs/hubfs/image-png-Aug-22-2023-01-28-58-7107-PM.png?width=560&height=241&name=image-png-Aug-22-2023-01-28-58-7107-PM.png) ![](https://help.kolable.com/hs-fs/hubfs/image-png-Aug-22-2023-01-29-10-5775-PM.png?width=560&height=363&name=image-png-Aug-22-2023-01-29-10-5775-PM.png) 到此，已完成 LINE 第三方登入用戶端的設定，感謝您的操作與配合。 ➡️ 返回[【文章目錄】](https://help.kolable.com/migration/zh-tw/learn/settinglogingooglefacebookline#content)   #### 相關文章 [使用第三方登入常見錯誤 Google/LINE](https://help.kolable.com/zh-tw/learn/commonloginerrorsgooglefacebookline?hsLang=zh-tw) - [使用手冊](https://help.kolable.com/migration/zh-tw/learn/%E4%BD%BF%E7%94%A8%E6%89%8B%E5%86%8A?hsLang=zh-tw) - [常見問題](https://help.kolable.com/migration/zh-tw/learn/%E5%B8%B8%E8%A6%8B%E5%95%8F%E9%A1%8C?hsLang=zh-tw) - [教學手冊](https://help.kolable.com/migration/zh-tw/learn/%E6%95%99%E5%AD%B8%E6%89%8B%E5%86%8A?hsLang=zh-tw#main-content) - [入門資訊 Before Started](https://help.kolable.com/migration/zh-tw/learn/%E6%95%99%E5%AD%B8%E6%89%8B%E5%86%8A?hsLang=zh-tw#%E5%85%A5%E9%96%80%E8%B3%87%E8%A8%8A-before-started) - [開始建立 Edit](https://help.kolable.com/migration/zh-tw/learn/%E6%95%99%E5%AD%B8%E6%89%8B%E5%86%8A?hsLang=zh-tw#%E9%96%8B%E5%A7%8B%E5%BB%BA%E7%AB%8B-edit) - [百科全書](https://help.kolable.com/migration/zh-tw/learn/%E7%99%BE%E7%A7%91%E5%85%A8%E6%9B%B8?hsLang=zh-tw) [![kolable-logo](https://help.kolable.com/hubfs/KOLABLE.svg "kolable-logo")](https://kolable.com) 版權所有 © 2026，台灣數位遊牧者協會