Laravelで爆速API開発シリーズ「JWTユーザログイン編」

バックエンド
10861 view

Laravelで爆速API開発シリーズ「JWTユーザログイン編」

最終更新日:2019/02/15

Laravelで爆速API開発シリーズ第一弾は「ユーザログイン」です！
ステートレスWebAPIを構築するなら必ず押さえておきたいJWT認証の導入方法とPOSTMANの使い方を徹底解説します。

ゴール

二つのエンドポイントを作成する

[POST]/api/login

ユーザ名とパスワードをリクエストするとjwtトークンが返ってくる

[GET] /api/me

jwtトークンを付与してリクエストするとユーザ情報が返ってくる

使うもの

POSTMAN

POSTMANは、httpリクエストを簡単に送れる便利なツールです。使い方がわからない人もこの記事でバッチリ説明するのでとりあえずダウンロードしておきましょう！

Laravelプロジェクトの作成

まずは新規プロジェクトを作成しましょう。

composer create-project laravel/laravel --prefer-dist laravel-api

忘れずにマイグレーションコマンドを実行します。

php artisan migrate

次にlaravelアプリケーションに一瞬で認証機能を組み込める魔法のコマンドを実行しましょう。

php artisan make:auth

これは認証ロジックとビューを一瞬で生成してくれる便利なコマンドです。生成されたものを直接使うわけではありませんが、新規登録やログインのテストをするときに便利なので実行しておきましょう。（本番環境では無効化するのをお忘れずに！）

キャプチャのように右上にLOGINとREGISTERボタンが出現します。

REGISTERボタンを押して適当にユーザを作ってLOGINできるか試してみましょう。

jwt-authをインストールする

以下のコマンドでjwt-authをインストールします。

composer require tymon/jwt-auth:dev-develop --prefer-source

JWT（ジェット）とは

JWT（ジョット）とは JSON Web Token の略で、電子署名付きのURLとして利用出来る文字だけで構成されるURL-SAFEなJSONのこと

webサイトでの認証はsessionを使ったものが長らく一般的でしたが、文字列ベースのjwtを使うことでwebブラウザ以外でも様々なクライアントに対応することができます。

jwt-authの設定

以下のコマンドを実行しましょう。

php artisan vendor:publish --provider="Tymon\JWTAuth\Providers\JWTAuthServiceProvider"

php artisan jwt:secret

次に以下のようにconfig\app.phpのproviders配列とaliases配列にjwt-authの登録を行います。

config\app.php

'providers' => [

// ...

  Tymon\JWTAuth\Providers\LaravelServiceProvider::class,
],

'aliases' => [

// ...

  'JWTAuth' => Tymon\JWTAuth\Facades\JWTAuth::class,
  'JWTFactory' => Tymon\JWTAuth\Facades\JWTFactory::class,
],

config\auth.phpを以下のように修正します。

'defaults' => [
  'guard' => 'api',
  'passwords' => 'users',
],

...

'guards' => [
  'api' => [
    'driver' => 'jwt',
    'provider' => 'users',
  ],
],

最後に、JWTAuthをapp/Http/Kernel.phpのrouteMidlewareに登録します。

app/Http/Kernel.php

protected $routeMiddleware = [

// ...

  'jwt.auth' => \Tymon\JWTAuth\Middleware\GetUserFromToken::class,
  'jwt.refresh' => \Tymon\JWTAuth\Middleware\RefreshToken::class,
];

ユーザモデルを更新する

Laravelにデフォルトで入っているapp\User.phpを編集して以下のように書き換えましょう。

<?php
namespace App;
use Illuminate\Notifications\Notifiable;
use Illuminate\Foundation\Auth\User as Authenticatable;
use Tymon\JWTAuth\Contracts\JWTSubject;

class User extends Authenticatable implements JWTSubject {
  use Notifiable;
  /**
   * The attributes that are mass assignable.
   *
   * @var array
   */
  protected $fillable = [ 'name', 'email', 'password', ];
  /**
   * The attributes that should be hidden for arrays.
   *
   * @var array
   */
  protected $hidden = [ 'password', 'remember_token', ];
  /**
   * Get the identifier that will be stored in the subject claim of the JWT.
   *
   * @return mixed
   */
  public function getJWTIdentifier() {
    return $this->getKey();
  }

  /**
   * Return a key value array, containing any custom claims to be added to the JWT.
   *
   * @return array
   */
  public function getJWTCustomClaims()
  {
    return [];
  }
}

お疲れ様です。以上でjwt-authの設定は終わりです。この辺は手順通りにやるだけなのですが、間違いやすいところなので慎重に行なっていきましょう。うまくできたら次から認証ロジックを組み立てていきます。

認証ロジックを構築する

認証用コントローラを作成する

以下のコマンドを実行して認証ロジック用のコントローラを作成しましょう。

php artisan make:controller AuthenticateController

コントローラの中身を以下のように書き換えます。

<?php

namespace App\Http\Controllers;
use Illuminate\Http\Request;
use JWTAuth;
use Tymon\JWTAuth\Exceptions\JWTException;

class AuthenticateController extends Controller {
  public function authenticate(Request $request) {
    // grab credentials from the request
    $credentials = $request->only('email', 'password');       
    try {
      // attempt to verify the credentials and create a token for the user
      if (! $token = JWTAuth::attempt($credentials)) {
        return response()->json(['error' => 'invalid_credentials'], 401);
      }
    } catch (JWTException $e) {
      // something went wrong whilst attempting to encode the token
        return response()->json(['error' => 'could_not_create_token'], 500);
    }

    // all good so return the token
    return response()->json(compact('token'));
  }
}

少し複雑ですが、やっていることはリクエストからemailとpasswordをとってJWTAuth::attemptメソッドで認証を試み、失敗した場合は401コードを返し、成功した場合はtokenを発行してレスポンスとして返すというものです。

ルーティングを追加する

認証用コントローラが作成できたら、ルーティングを追加します。routes\api.phpに以下の記述を追加します。

routes\api.php

Route::post('authenticate', '[email protected]');

これによって/api/authenticateにpostリクエストを投げると先ほど作成したAuthenticateControllerのauthenticateメソッドが呼び出されるようになります。

以上で認証ロジックは完成です。。。。とは言っても本当に動いているのでしょうか？？
次は構築したAPIをPOSTMANで実際にテストする方法を解説します。

POSTMANでAPIにリクエストする

いよいよPOSTMANの出番です。この記事ではアプリケーションのルートURLをhttps://laravel-api.localに設定しましたが、お好きなように設定してください。

テストユーザを作成する

キャプチャのように適当にユーザを作成してください。

POSTMANを開く

POSTMANを開いてキャプチャのようにHTTPメソッドをPOST、urlを設定したものにしてください。

この状態でSendボタンを押すと

{"error":"invalid_credentials"}

と表示されます。ユーザ名とパスワードを指定してないからですね^^

以下のようにすればユーザ名とパスワードを送信できます。

下の方にわけのわからない長い文字列が表示されれば成功です。これがJWTです。これにて認証ロジックは完成です。POSTMANはガンガン使っていくので今のうちに慣れていきましょう！

meエンドポイントを作成する

先程までの課程でemailとpasswordを送信するとJWTを発行できるようになりました。このJWTを付与してリクエストするとそのユーザ情報が返るエンドポイントを作成しましょう！

コントローラを作成する

本来はコントローラのロジックはなるべく分割すべきですが、今回は簡単のため、先程作成したAuthenticateControllerに下記のコードを追加しましょう。

public function getCurrentUser()
{
  $user = JWTAuth::parseToken()->authenticate();
  return response()->json(compact('user'));
}

ルーティングを定義する

routes/api.phpに下記のルート定義を追加しましょう。

  Route::group(['middleware' => 'jwt.auth'], function () {
  Route::get('me', '[email protected]');
});

POSTMANでリクエストを投げる

キャプチャのように設定してSendを押しましょう！
ポイントはHeadersのところを選んでkeyにAuthorizationを設定し、先程ログインのところでゲットしたJWTの前にBearerをつけて設定することです。

うまくできましたでしょうか？？
この辺の設定は最初は大変ですが慣れると爆速で認証付きAPIを立ち上げられるようになりますのでぜひマスターしましょう！

うまくいかない場合はコメントに書いて頂ければ対応します!

Laravelのおすすめ本紹介

Laravelで爆速API開発シリーズ以外にも、Laravelの理解を深めたい方にはこちらの本がおすすめです！

PHPフレームワーク Laravel Webアプリケーション開発バージョン5.5 LTS対応

Laravelの本は数多く出版されていますが、この本が断然わかりやすいと思います！

Laravelマスターを目指すならぜひ一度ご覧になってみるといいと思います。

この記事を書いた人
最新の記事

WINDII

WINDII（ウィンディ）は、フリーランスエンジニアが運営するテックメディアです。日々の業務で得た知見を、皆さんに役立つコンテンツにして発信していくので応援よろしくお願いします！また、Slackで無料コミュニティも運営しています。たくさんのエンジニアが参加していて、プログラミングの相談や雑談などをしている楽しいコミュニティなので、興味ある方はぜひお気軽にご参加ください。 Slackコミュニティはこちらから

現役フリーランスエンジニアが運営するテックメディア。日々の業務で得た知識を発信していきます！

WINDIIテック