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

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

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

連載記事

Authentication API - Apiで認証

サンプル


フォルダ構成


└─ 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で状態管理

okuda

Webdeveloper

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

お気軽に
お問い合わせください。

お問い合わせ