昨天看完第三方登入的概念，今天要來嘗試建置會員系統與第三方登入功能

會員系統與第三方登入的設計

table 設計

下面是我之前別的實作專案，

• 這個專案有自己的會員系統，所以有 email(帳號)、password 欄位，使用者可以直接在這個專案註冊

• 比較需要注意的是，密碼現在都傾向存入 hash 過的資料，如此一來即便後端工程師也無法得知會員的真正密碼，可以保護個資安全

  （有些公司會碰到帳號密碼忘記打去問資訊部門，然後資訊部門叫你自己去按網頁上「忘記密碼」按鈕，就是因為即使他們進去看，也看不到你的密碼）

• email_verified_at 欄位有兩種用途：

  • 驗證使用者信箱使用，當使用者僅使用網站本身會員系統註冊時，可以加入驗證信發送環節，確認使用者收得到信、email沒有打錯；收不到驗證信的信箱這個欄位就是空白，如果需要寄送電子報等需求可跳過這筆資料
  • 第三方服務下，email驗證環節就相信第三方服務已經幫我們驗證，使用者不用再去收驗證信點選確認，增加使用者體驗。程式碼方面，成功登入者就更新登入時間或初次註冊時間。

驗證流程

整體第三方登入會有：

• email，在專案網站被當成帳號，不可與他人帳號重複
• 第三方服務 ID ，可以當成專案網站帳號，也可以只是當成一個欄位，端看網站怎麼設計

被當成專案網站帳號的 ID 需要具有唯一性，A 使用者的 ID 不可跟 B 使用者重複

我在這裡的設計是，

• 下圖 id = 12：假設會員本身已經有用 happymia299@gmail.com 註冊帳號，但他本人忘記了，選擇第三方登入、用 google 帳號進來，那我的程式碼就會去比對：這個 email 先前已經註冊，只要更新會員資料、以及 google_id 欄位即可。

  

• 下圖 id = 9：如果他完全沒有註冊過，就會用 Google 回傳進來的 google_id 和 email，讓我新增會員資料。

  

• 此外， id = 9 這位會員下一次又忘記用哪個第三方登入，而且他所有第三方服務都用同一個 email 帳號申請的，那這裡的設計就可以讓他不論用哪一種第三方服務進入網站，都會整合到同一筆會員資料裡面。

Laravel Socialite

官方文件：https://laravel.com/docs/10.x/socialite#retrieving-user-details-from-a-token-oauth2

所有這個套件可用的第三方登入與指南：https://socialiteproviders.com/about/ (重要！)

安裝

composer require laravel/socialite

從 Socialite Providers 網站找到想要的第三方服務，我這裡要使用Line

安裝 socialiteproviders/line 套件

composer require socialiteproviders/line

參數設定

依據說明，要把下列內容加入 config/services.php 及 .env 檔案

//config/services.php
'line' => [
        'client_id' => env('LINE_CLIENT_ID'),
        'client_secret' => env('LINE_CLIENT_SECRET'),
        'redirect' => env('LINE_REDIRECT_URI')
    ],

// .env
# Line 第三方登入
LINE_CLIENT_ID=
LINE_CLIENT_SECRET=
LINE_REDIRECT_URI=

這裡的參數需要先去 Line 開發人員網站設定取得（請繼續看下去）

Line 設定

首先需要到 Line Developers 主控台進行設定，登入後會顯示如下圖

點選 Create a new Channel > LINE Login

channel type 選擇 LINE Login

以下是我填寫的內容

按下 create 之後，就會看到下面畫面，點入剛剛新增的 channel，可以看到進一步設定

點進來會看到下面畫面

往下拉，可以看到自己的 ID 跟 SECRET (資安疑慮我用圖片碼掉)，要來這裡複製進 .env 檔案裡面

.env 裡面貼入 USER ID 及 SECRET

這裡的 REDIRECT_URL 是當 Line 已經驗證使用者身份後，要把使用者導向專案網站的網址，這部分與實際測試我們留到明天來看看～～