Qiitaの様なサービス作成中 ユーザー認証 連載(2)

基本情報

• 次に作りたいQiita、dev.toの様なサービスについて で書いたサービスを開発中です。
• 前回の記事

最初に作るところ

記事投稿サービスですので、何はともあれ記事を投稿できなければ何も始まりません。そして、記事を投稿するためにはユーザー認証が必要なので、まずはそこを作っていきます。

Laravel Socialite

現在Laravel Socialiteというものがあり、OAuthを利用した認証はこれを使って簡単に実装することができるようになっています。これを使ってGitHub認証を作成していきます。

以下解説ですが基本的にはマニュアル通りです。

Socialiteをインストール

composer require laravel/socialite

設定する

config/services.php

'github' => [
    'client_id' => env('GITHUB_CLIENT_ID'),
    'client_secret' => env('GITHUB_CLIENT_SECRET'),
    'redirect' => env('GITHUB_AUTH_CALLBACK_URL'),
],

※実際の値を.envに追加する必要があります。

ルーティング

ここはちょっと本家マニュアルとは変えていますが、URLでログインするサービスを変更できるようにしているだけです。

Route::get('login/{provider}', 'Auth\LoginController@redirectToProvider');
Route::get('login/{provider}/callback', 'Auth\LoginController@handleProviderCallback');

コントローラ

上記ルーティングに伴いこちらも少し変えています。UserSocialはユーザーにhasManyで持たせている、OAuthプロバイダ毎のデータ保存テーブルを作成しました。アバター画像などもUserではなくこちらに入れて切り替えられるようにしたりします。

Auth/LoginController.php

    public function redirectToProvider(string $provider)
    {
        return Socialite::driver($provider)->redirect();
    }

    public function handleProviderCallback(string $provider)
    {
        $providerUser = Socialite::driver($provider)->user();

        $userSocial = UserSocial::firstOrNew([
            'provider' => $provider,
            'provider_id' => $providerUser->getId()
        ]);

        if ($userSocial->id) {
            $user = User::find($userSocial->user_id);
        } else {
            $user = new User;
        }

        User::setSocialInfo($user, $userSocial, $providerUser);
        $user->save();
        $userSocial->user_id = $user->id;
        $userSocial->save();
        Auth::login($user, true);

        return redirect('/');
    }

setSocialInfo内でuserやuserSocialに色々値を代入しています。ここではswitchなどでプロバイダ毎に代入処理を変えなければならないので、無性にElixirのパターンマッチを使った関数呼び出しが恋しくなります。

ちなみに上記のコードはまだ作成途中で複数のプロバイダ登録に対応できていないので、実際にちゃんと作るときはelse内を調整したり、__construct内のexcept指定で上記２つのメソッドにログインしていてもアクセスできるようにしておく必要等があります。

まとめ

非常に短い記事になってしまいましたが、つまりはこれくらいの感じで認証ができてしまうので非常に簡単でした。他のサービスの認証も追加したり、前述の通りログイン中に他のサービスの連携追加も行う必要があるのでそれも作成はする必要がありますが、とりあえずそれは一旦置いておきます。

これで記事投稿を作成する準備が整いました。認証のところをずっといじっているより、とりあえずどんどん先に進めて見る方が最終的に効率も良いし達成感が得られ飽きにくくなりますのでどんどん次に行きます。

次回

多分マークダウンエディタを導入して記事を投稿できるようにする
もしくは豆腐をつなぎに使った低アレルゲンハンバーグの作り方