Json Web Token

JWT→ジョットと発音する

JWTは、ヘッダー（Header）、ペイロード（Payload）、署名（Sinature）をピリオドで区切った文字列。

ヘッダー

{
  "typ": "JWT",　　// 固定値
  "alg": "HS256"　// 署名アルゴリズム HS256で良い
}

これをBase64urlエンコードする。

ペイロード

JSONをBase64urlエンコードした文字列
個々の項目名をクレームと呼ぶ

• 予約クレーム

• パブリッククレーム

IANA JSON Web Token Claim Registryに登録された上記以外のクレーム

• プライベートクレーム

上記以外の独自に作ったクレーム

署名

エンコード済みヘッダー、ピリオド（"."）、エンコード済みペイロードを連結したものを入力値として、"alg"の署名アルゴリズムで署名し、Base64urlエンコードした文字列

クライアント側の実装例

サーバから受け取ったJWTをクッキー or ローカルストレージに保存する
API実行時にJWTをヘッダのAuthorizationキーの値に設定する。
Authorization: Bearer <JWT>
※Bearerスキームが一般的

ローカルストレージの使い方

localStorage.setItem("message", "こんにちはlocalStorage"); // 設定
localStorage.getItem("message"); // 取得
localStorage.clear(); // 削除

セッションストレージの使い方（ウインドウやタブを閉じるまで有効）

sessionStorage.setItem("message", "こんにちはlocalStorage"); // 設定
sessionStorage.getItem("message"); // 取得
sessionStorage.clear(); // 削除

認証サーバ側の実装例

認証OKの場合、redisにユーザIDをキーにデータを登録する。JWTを生成してクライアントに送付する。

リクエストヘッダのJWTを検証する。
JWTが不正 or 有効期間(24時間)が切れていた場合、ログイン画面を表示する。
ユーザIDに紐づくセッション情報がredisに存在するかどうかを確認する。
redisデータが存在しない、redisデータの有効期限が切れている(60分)場合、ログイン画面を表示する。
ログアウト時にredisのセッション情報を削除する。