API開発における JWT デバッグ手法と 401 エラー解決手順

JWT 認証 デバッグ API JavaScript

Web API開発やSPA（Single Page Application）開発で 401 Unauthorized や 403 Forbidden エラーが発生した際の、JWT（JSON Web Token）のデバッグフローと検証ツールです。

1. オンライン JWT 安全デコーダー

トークンの中身（Payload / Header）をサーバーに一切送信せず、ブラウザローカルで安全に解析します。

🔍 この場でJWTをデコードして中身を確認する

注意: このツールはデコードのみ行います。署名検証は行いません。改ざん検知には利用できません。

※ 入力・貼り付け時に自動でデコードされます

 
 
  
 
 
 
 
署名の検証 (Signature Verification)
 
  
   
 
  
  
 



2. APIで 401/403 エラーが発生した時のデバッグ 4 ステップ


ステップ 1: exp (有効期限) のタイムスタンプチェック


401エラーの約8割はアクセストークンの有効期限切れです。
Payload 内の exp（Unix秒）と現在のUnix時刻（Math.floor(Date.now() / 1000)）を比較します。


// JSでの期限切れ判定例
const isExpired = payload.exp < Math.floor(Date.now() / 1000);
if (isExpired) {
  console.error("トークンの期限が切れています。リフレッシュトークンで再取得が必要です。");
}


ステップ 2: Authorization ヘッダーの文字送りチェック


HTTPリクエストヘッダーの構文ミスを確認します。


    

  • ❌ Authorization: eyJhbGci... (Bearer が抜けている)
    • 

  • ❌ Authorization: BearereyJhbGci... (Bearer の後にスペースがない)
    • 

  • ✅ Authorization: Bearer eyJhbGci... (正しい形式)
    • 



ステップ 3: aud (Audience) と iss (Issuer) の検証


複数のマイクロサービスや Auth0 / Firebase Auth などを利用している場合、別サービス向けのトークンを間違ったAPIエンドポイントに送信していないか確認します。


    

  • iss: 信頼できる認証サーバーのURLと一致しているか
    • 

  • aud: 受け取り側のAPIリソース識別子（https://api.example.com）と一致しているか
    • 



ステップ 4: 署名（Signature）と秘密鍵（Secret / RS256 Key）のミスマッチ


Payload を改ざんしていない場合でも、バックエンド側で設定している秘密鍵（HMAC HS256）や公開鍵（RSA RS256 の JWKS）が開発環境と本番環境でズレていると署名検証エラーになります。




3. Chrome DevTools での確認方法


    

  1. Network タブ: 失敗している API リクエストを選択し、Request Headers 内の Authorization: Bearer <TOKEN> をコピー。
    2. 

  2. Application タブ: Cookie または LocalStorage / SessionStorage に保存されたトークン文字列を確認。
    3.