Laravel mix vue No.3 - Authentication API - Apiで認証

こんにちは、あすかのkoheiです。

前回作成したUIで使用する認証Apiをlaravelで作ります。

連載記事

• Laravel mix vue No.1 - Docker Environment - Dockerでlaravel環境 (laradockを使わない)
• Laravel mix vue No.2 - Vue Router, Component - Vueルータの設定とコンポネント作成
• Laravel mix vue No.3 - Authentication API - Apiで認証
• Laravel mix vue No.4 - Vuex - Vuexで状態管理
• Laravel mix vue No.5 - Api Email Verification - メール認証に変更
• Laravel mix vue No.6 - Api Resetting Passwords - パスワードリセット
• Laravel mix vue No.7 - Socialite - ソーシャルログイン
• Laravel mix vue No.8 - Laravel Internationalization - Laravel多言語化
• Laravel mix vue No.9 - Vue Internationalization - Vue多言語化

Authentication API - Apiで認証

サンプル

• このセクションを始める前
  github ldocker 03

• 完成
  github ldocker 04

---

フォルダ構成

└─ server
   └─ app
   │  └─ Providers
   │  │ └─ RouteServiceProvider.php
   │  └─ Http
   │    └─ Controllers
   │       └─ Auth
   │          └─ RegisterController.php
   │          └─ LoginController.php
   │    └─ Kernel.php
   └─ routes
   │   └─ web.php
   │
   └─ vendor
      └─ laravel
         └─ ui
            └─ auth-backend
               └─ RegistersUsers.php
               └─ AuthenticatesUsers.php

---

Apiのルート作成

Apiのルート定義を確認とホームルートの設定

    ...

    /**
     * The path to the "home" route for your application.
     *
     * @var string
     */
-   public const HOME = '/home';
+   public const HOME = '/';

    ...

    protected function mapApiRoutes()
    {
        Route::prefix('api')
            ->middleware('api') // これは「app/Http/Kernel.php」の「protected $middlewareGroups」に定義
            ->namespace($this->namespace)
            ->group(base_path('routes/api.php'));
    }

    ...

ミドルウェアの設定

    protected $middlewareGroups = [
        'web' => [
            \App\Http\Middleware\EncryptCookies::class,
            \Illuminate\Cookie\Middleware\AddQueuedCookiesToResponse::class,
            \Illuminate\Session\Middleware\StartSession::class,
            // \Illuminate\Session\Middleware\AuthenticateSession::class,
            \Illuminate\View\Middleware\ShareErrorsFromSession::class,
            \App\Http\Middleware\VerifyCsrfToken::class,
            \Illuminate\Routing\Middleware\SubstituteBindings::class,
        ],

        'api' => [
-           'throttle:60,1',
+           // 'throttle:60,1',
            // 'web'の内容をペースト
+           \App\Http\Middleware\EncryptCookies::class,
+           \Illuminate\Cookie\Middleware\AddQueuedCookiesToResponse::class,
+           \Illuminate\Session\Middleware\StartSession::class,
+           // \Illuminate\Session\Middleware\AuthenticateSession::class,
+           \Illuminate\View\Middleware\ShareErrorsFromSession::class,
+           \App\Http\Middleware\VerifyCsrfToken::class,
            \Illuminate\Routing\Middleware\SubstituteBindings::class,
        ],
    ];

ルートの設定

-   Route::middleware('auth:api')->get('/user', function (Request $request) {
-       return $request->user();
-   });

    // register
+   Route::post('/register', 'Auth\RegisterController@register')->name('register');
    // login
+   Route::post('/login', 'Auth\LoginController@login')->name('login');
    // logout
+   Route::post('/logout', 'Auth\LoginController@logout')->name('logout');

    // user
+   Route::get('/user', function () {
+       return Auth::user();
+   })->name('user');

    // トークンリフレッシュ
+   Route::get('/refresh-token', function (Illuminate\Http\Request $request) {
+       $request->session()->regenerateToken();
+       return response()->json();
+   })->name('refresh-token');

---

登録Apiの作成

registeredメソッドの確認

RegistersUsersトレイトの中にメソッドのみが定義されている

...

    /**
     * The user has been registered.
     *
     * @param  \Illuminate\Http\Request  $request
     * @param  mixed  $user
     * @return mixed
     */
    protected function registered(Request $request, $user)
    {
        //
    }

...

registeredメソッドの作成

registered メソッドをカスタマイズするために 「server\app\Http\Controllers\Auth\RegisterController.php」 のなかに上記トレイトで追加されている registered メソッドをオーバーライドする

<?php

    namespace App\Http\Controllers\Auth;

    use App\Http\Controllers\Controller;
    use App\Providers\RouteServiceProvider;
    use App\User;
    use Illuminate\Foundation\Auth\RegistersUsers;
    use Illuminate\Support\Facades\Hash;
    use Illuminate\Support\Facades\Validator;
+   use Illuminate\Http\Request;

    class RegisterController extends Controller
    {
        ...

+       protected function registered(Request $request, $user)
+       {
+           return $user;
+       }

        ...
    }

authenticatedメソッドとloggedOutメソッドの確認

AuthenticatesUsers トレイトの中にメソッドのみが定義されている

...

    /**
     * The user has been authenticated.
     *
     * @param  \Illuminate\Http\Request  $request
     * @param  mixed  $user
     * @return mixed
     */
    protected function authenticated(Request $request, $user)
    {
        //
    }

...

    /**
     * The user has logged out of the application.
     *
     * @param  \Illuminate\Http\Request  $request
     * @return mixed
     */
    protected function loggedOut(Request $request)
    {
        //
    }

...

authenticatedメソッドとloggedOutメソッドの作成

authenticated メソッドをカスタマイズするために 「server\app\Http\Controllers\Auth\LoginController.php」 のなかに上記トレイトで追加されている authenticatedメソッドと loggedOutメソッドをオーバーライドする

<?php

    namespace App\Http\Controllers\Auth;

    use App\Http\Controllers\Controller;
    use App\Providers\RouteServiceProvider;
    use Illuminate\Foundation\Auth\AuthenticatesUsers;
+   use Illuminate\Http\Request;

    class LoginController extends Controller
    {

        ...

+       /**
+        * Send the response after the user was authenticated.
+        *
+        * @param  \Illuminate\Http\Request  $request
+        * @return \Illuminate\Http\Response
+        */
+       protected function authenticated(Request $request, $user)
+       {
+           return $user;
+       }

+       /**
+        * The user has logged out of the application.
+        *
+        * @param  \Illuminate\Http\Request  $request
+        * @return mixed
+        */
+       protected function loggedOut(Request $request)
+       {
+           // セッションの再生成
+            $request->session()->regenerate();
+
+            return response()->json();
+       }

    }

ドルウェアによる認証時のリダイレクトコントロールを修正

ログインには非ログイン状態でのみアクセスできるようにドルウェアでコントロールされているので、 ログイン時に認証するとデフォルトではRouteServiceProviderに設定しているHOMEにリダイレクトされる

ApiでHOMEに設定されたページのHTMLが返されるのではなく、userApi（/user）のレスポンスが返されるように server\app\Http\Middleware\RedirectIfAuthenticated.phpを修正する

...

    public function handle($request, Closure $next, $guard = null)
    {
        if (Auth::guard($guard)->check()) {
-           return redirect(RouteServiceProvider::HOME);
+           return redirect()->route('user');
        }

        return $next($request);
    }

...

これでUIで使用する認証Apiができました！

次はこれLaravel mix vue No.4 - Vuex - Vuexで状態管理