生活分享

WordPress 社群登入:LINE、Google 與 Facebook 的串接檢查

WordPress 加入 LINE、Google 或 Facebook 登入,不只是多放幾個按鈕。本篇說明社群登入外掛與平台應用程式的分工、回呼網址核對、既有帳號連結、註冊角色與停用前的復原準備,並以 Nextend Social Login 示範設定順序,協助台灣站長確認一般訪客真的能登入原本的會員帳號。

更新日期: 閱讀時間約 6 分鐘

身分盾牌、伺服器與會員頁螢幕組成的原創插圖,呈現社群驗證回到網站帳號。
圖片:Mokaair (© Mokaair)

讀者原本用電子郵件註冊,後來按了 Google 登入,卻發現收藏清單是空的。這可能不是資料被刪除,而是網站建立或連到了另一個帳號。社群登入的重點,是讓平台身分正確對應到網站會員,並保留另一條可用的登入路徑。

可以先選一個讀者常用的平台完成流程,再評估增加其他入口。以下使用 Nextend Social Login 作為設定例子,介紹 LINE、Google 與 Facebook 的主要差異。平台後台會更新,畫面名稱與審查狀態應以操作當日的實際應用程式為準。

先確認外掛版本與網站會員規則

Nextend 官方外掛頁列出的免費平台包含 Google 與 Facebook,LINE 則屬於 Pro Addon;部分會員表單整合也列在付費功能。先確認你的登入頁由哪個工具產生,再查對應整合,不要只看到免費版有社群按鈕就假設所有會員表單都能直接使用。

社群登入成功後取得什麼角色、是否允許新會員註冊,以及待審帳號能否登入,仍要與原本會員制度一致。若網站要求人工審核,請特別測試社群入口不會略過該規則。授權平台提供資料與取得網站會員資格,是兩個需要分別驗證的步驟。

  1. 列出要支援的平台、會員表單來源及所需外掛版本。
  2. 記錄新會員角色、既有帳號連結及待審帳號處理方式。
  3. 建立測試應用程式或隔離環境,先完成一個平台的全流程。

回呼網址由外掛提供,逐字核對

在外掛中選擇平台並閱讀 Getting Started,取得它要求的回呼網址,再到平台建立應用程式填入。回呼是平台驗證後把結果交回網站的位置,不一定是首頁,也不等於登入完成後給讀者看的會員中心。這兩種網址不要互換。

Google 官方明確要求 redirect_uri 與核准的網址完全符合,包含通訊協定、大小寫與結尾斜線。LINE 也要在 Channel 的 LINE Login 設定登錄回呼。複製時確認正式或測試網域,以及外掛是否改用代理頁面,避免把另一個環境的設定帶過來。

Client Secret 或 Channel Secret 只放在外掛指定的後台設定或受控的伺服器設定中,不要貼進頁面、公開截圖或前台程式碼。網站搬家、換網域或更換登入網址後,再回到各平台更新相應回呼,並重新測試。

依各平台完成應用程式設定

Google 登入需在 Google Cloud 專案建立網頁應用程式用戶端,設定品牌資訊、使用對象及授權重新導向網址,再把 Client ID 與 Secret 填回外掛。只要求登入需要的資料範圍;若同一專案另取用其他服務,額外權限和驗證需求也應另行確認。

LINE 使用 LINE Login Channel,選擇 Web app 並設定回呼。需要取得電子郵件時,LINE 官方要求先申請 Email address permission,並說明蒐集用途。不要假設每次登入都能拿到所有個人資料;網站若需要補填聯絡信箱,應另外驗證補填流程。

Facebook 部分,Nextend 現行設定章節列出應用程式建立、隱私及資料刪除說明、Business Verification、App Review 與發布等步驟。其舊 FAQ 仍有不同年代的敘述,不宜沿用免審查結論。實際需要完成的項目,請以 Meta 後台目前列出的要求及核准狀態確認。

先測一般訪客,再顯示登入按鈕

外掛提供的設定驗證可先協助發現 ID、密鑰與回呼錯誤,但它不等於所有使用者都已能登入。平台的開發或測試狀態可能限制可用帳號,應在完成必要發布或審查後,請有授權的測試者以一般使用者身分確認。

測試至少包含首次登入、再次登入、拒絕授權和返回上一頁。讓拒絕授權的人回到可理解的登入畫面,提供其他方式,不要在取消後顯示空白頁或無限重新導向。若使用者沒有提供預期的電子郵件,核對外掛如何處理,避免生成無法復原的會員帳號。

手機也要從不同入口測試,例如一般瀏覽器與社群 App 內開啟的頁面。部分平台對內嵌瀏覽器有限制,Nextend 有不支援 WebView 時的按鈕處理設定;可以提供用外部瀏覽器開啟的引導,不要承諾任何 App 裡都能使用相同流程。

既有帳號要連結,不要隨意合併

Nextend 提供在 WordPress 個人資料頁加入或移除社群帳號的功能。對已有重要資料的會員,較清楚的操作是先用原方式登入,再從帳號設定連結社群身分,接著登出重登,確認看到的是同一份資料和同一個網站使用者。

外掛可能有自動比對或連結邏輯,應閱讀當前版本說明並在測試站驗證同信箱、不同信箱及已連結帳號的情境。不要只因兩個人顯示相同名字,就手動合併會員。需要處理衝突時,先核實對兩個帳號的控制權並保存資料對應。

社群登入的身分確認不能代替網站的操作授權。讀者能登入,仍不應因此得到發布文章或管理其他人的能力;原本的雙因素驗證、會員限制與第三方登入整合也要按各入口測試,而不是只檢查傳統帳密登入。

停用平台前,先讓會員能走另一條路

取消某個登入平台前,先確認會員有可用且已驗證的聯絡方式,並能設定或重設網站密碼。用測試帳號解除連結後,確認仍能登入同一個會員帳號。若只把按鈕隱藏,原先完全依賴它的使用者可能立即失去入口。

網站登出、解除帳號連結、撤銷平台授權與刪除會員資料是不同操作。請在帳號說明中分開描述,並核對外掛與其他服務實際保存的資料範圍。使用者取消授權後,網站仍可能保有先前建立的會員資料,應提供清楚的資料處理聯絡方式。

完成後保存各平台應用程式持有人、回呼網址、所需權限、測試結果與確認日期。將平台通知交給持續管理網站的人,避免應用程式留在已離任廠商帳下。日後規則或版本改變時,這份對照表能幫助你知道要從哪裡重新驗證。

依序展示平台驗證、回呼網址、網站帳號與會員權限四個步驟,並提醒保留替代登入。
完成平台登入,還要確認是正確會員與正確權限。 · 圖片:Mokaair (© Mokaair)
平台能力與外掛方案是兩層條件,請同時核對。
平台設定重點特別驗收
Google網頁用戶端與授權回呼帳號選擇及一般使用者登入
LINELogin Channel 與電子郵件權限缺少信箱及手機返回流程
Facebook應用程式權限、審查與發布開發帳號之外能否使用
共同事項WordPress 帳號連結與角色舊資料、取消授權與替代登入

  • 生活分享

    WordPress 側邊欄與小工具:安排資訊與固定區塊

    WordPress 側邊欄可以放搜尋、作者介紹與相關內容,但應先確認它對讀者是否有幫助。本文整理傳統小工具、區塊小工具及區塊佈景的差異,說明如何新增、排序、暫時移除與驗收,也比較一般排列、黏附與固定顯示的用途。透過桌面、手機和文字放大的檢查,避免資訊區塊遮住正文或表單,讓網站增加入口時仍維持清楚的閱讀順序。

  • 生活分享

    WordPress 備份怎麼做:檔案、資料庫與還原演練

    WordPress 備份不能只看成功訊息。本篇用檔案、資料庫與異地保存建立備份清單,說明 UpdraftPlus、WPvivid 的操作入口、還原限制及隔離演練,幫你確認網站資料真的拿得回來。也整理排程、保留版本、設定檔與驗收紀錄,讓個人網站或工作室有人能接手復原。

  • 生活分享

    WordPress 會員與角色:誰能看、誰能改、誰能管理

    WordPress 的管理員、編輯、作者與訂閱者分別能做什麼?本篇用小型團隊的投稿與會員閱讀需求,拆解角色、操作權限和內容可見性的差別,說明 User Role Editor 的設定方向,以及隱藏選單為何需要另外驗證實際存取,提供權限表、測試步驟和交接提醒,避免為了方便把所有人設為管理員。

  • 生活分享

    安裝 WordPress 主題與外掛:來源、更新與停用流程

    安裝 WordPress 佈景主題或外掛前,先確認要解決的問題、下載來源、版本相容性與回復方式。本文整理後台搜尋、官方 ZIP 上傳、啟用及驗收流程,並說明更新、停用和刪除各自可能影響什麼。適合需要自行維護網站的台灣使用者,用一份簡短紀錄管理新增功能與長期成本,避免重複安裝、忘記授權或在正式站一次更動太多項目。

最新旅遊情報攻略

資料來源

生活分享