Laravel Jetstream透過OAuth協定登入網站

現代人多少都會有社群媒體（Facebook、Google、Instgram）的帳號，如果能夠在登入我們的會員網站時直接利用他們現有的帳號來進行登入及註冊，相信會讓使用者更加地願意加入成為自己的網站的會員。在自己的網站中利用別人的網站來進行會員驗證的協定使用的是OAuth，這個協定在Laravel網站中非常容易啟用，現在就來看看如何進行吧。

首先，假設你已經在自己的網站中加入了Jetstream的功能，為了讓網站可以使用OAuth的驗證工作，還需要加上另外一個socialite模組，安裝方式如下：

composer require laravel/socialite

此模組可以支援許多的社群網站之使用者驗證（例如Facebook、Google、LinkedIn、Twitter、Github等等），以官網說明的頁面來看，它的例子是利用Github的使用者登入，如果是要以Github為使用者驗證網站的話，要在config/services.php檔案中加入以下的設定（修改自官網）：

'github' => [
     'client_id' => env('GITHUB_CLIENT_ID'),
     'client_secret' => env('GITHUB_CLIENT_SECRET'),
     'redirect' => 'http://localhost:8000/login/github/callback/',
 ],

加入之後如下所示（config/services.php）：

其中，GITHUB_CLIENT_ID以及GITHUB_CLIENT_SECRET這兩個參數要放在.env的設定檔中，它內容則必需到Github.com的帳戶中去啟用（當然，你必需要有帳號才行），先進入settings頁面中，如下所示：

點擊上方箭頭所示的「 Developer settings」選項，會出現如下所示的頁面：

如上圖所示，先點選左側的「OAuth Apps」，再點選右上角的「New OAuth App」，即會出現如下所示的介面，讓我們填入基本的網址資料：

再按下下方的按鈕即可產生開發OAuth所需要的相關KEY，如下所示：

其中Client ID以及Client secret就是我們要填在.env檔案中的內容，如下所示：

在你的Controller中（在此例為MainController）中需要先使用以下的指令引入Socialite的功能：

use Laravel\Socialite\Facades\Socialite;

然後在Controller中加入以下兩個函式：

    public function redirectToProvider()
    {
        return Socialite::driver('github')->redirect();
    }

    /**
     * Obtain the user information from GitHub.
     *
     * @return \Illuminate\Http\Response
     */
    public function handleProviderCallback()
    {
        $user = Socialite::driver('github')->user();

        dd($user);
    }

並於web.php中加上以下的路由（假設我們的Controller是MainController）：

Route::get('login/github', [MainController::class, 'redirectToProvider']); Route::get('login/github/callback', [MainController::class, 'handleProviderCallback']);

然後，只要利用你的網址再加上/login/github，就可以進行登入了。不過，由於在本機測試的環境中是沒有SSL安全傳輸協定的，所以在Github進行完驗證完畢callback回來網站的時候會出現如下所示的錯誤訊息：

在本地端的測試環境中只要前往vendor\guzzlehttp\guzzle\src\Client.php這個檔案中，找到大約是233行的位置中的verify設定，把它改為false即可，如下所示：

如此再重新執行一次Github的驗證，就可以看到如下所示的Github驗證畫面：

按下「Sign in」按鈕之後，網站順利回呼，並出現以下的內容了：

儘管到此為止我們順利地利用Github協助進行使用者驗證，但是我們的網站並未成為已登入的狀態，原因是在使用者驗證之後並未把已驗證的使用者資料實際登入到網站的會員系統中，因此，在handleProviderCallback()這個函式中還要再進行一些修改，修改後的內容如下：

    public function handleProviderCallback()
    {
        $guser = Socialite::driver('github')->user();

        $user = User::firstOrCreate([
            'email' => $guser->email
        ], [
                'name' => $guser->name,
                'password' => Hash::make('password', ['rounds' => 12,])
        ]);

        Auth::login($user, true);

        return redirect("/");
    }

上述程式碼的目的是去檢查使用者是否已經存在了，如果存在了，就直接進行登入，若是不存在本地網站的使用者資料庫中的話，就以取得的使用者資料建立一筆會員記錄，並完成登入的動作，之後再轉址到主網站畫面去。