DevToolBox

JWT Generator (テスト用JWT生成)

HS256 / HS384 / HS512 署名付きのJWTをブラウザ内で生成。テスト・学習用途専用です。

⚠ このツールはテスト・学習用途専用です

本番環境のシークレットキーを入力しないでください。処理はブラウザ内で完結しますが、シークレットの取り扱いには常に注意してください。

For testing and learning only. Never paste production secret keys. All processing stays in your browser, but secrets always deserve careful handling.

ペイロード (JSON):

How to Use the JWT Generator

This free online JWT generator creates signed JSON Web Tokens for testing and learning, entirely in your browser. Pick a signing algorithm (HS256, HS384 or HS512), edit the payload JSON, enter a test secret, and click "JWTを生成". The tool builds the header, base64url-encodes the header and payload, and signs them with the Web Crypto API (crypto.subtle) — no library, no server, no network request.

Features

  • HS256 / HS384 / HS512 (HMAC with SHA-2) signing via the browser-native Web Crypto API
  • One-click claim presets: iat (issued at, now), exp (expires in 1 hour), and sample sub/name claims
  • UTF-8 safe payload encoding — Japanese and other non-ASCII claim values are handled correctly
  • Strict base64url output (RFC 7515): +-, /_, padding removed
  • Everything runs locally; the payload and secret never leave your device

What is a JWT?

A JSON Web Token (RFC 7519) is a compact, URL-safe token format made of three dot-separated parts: a base64url-encoded header, a base64url-encoded payload of claims, and a signature computed over the first two parts. With the HS* family, the signature is an HMAC keyed by a shared secret — anyone who knows the secret can both create and verify tokens. Generating a token by hand is the fastest way to understand exactly what a server checks when it validates one.

Why only HMAC algorithms?

RS256 and other asymmetric algorithms require a private key. Pasting a private key into any web form — even a browser-only one — normalizes a dangerous habit, so this tool deliberately supports only the HMAC family, where a throwaway test string is enough.

JWT Generatorの使い方

署名アルゴリズム(HS256 / HS384 / HS512)を選び、ペイロードのJSONを編集し、テスト用のシークレットを入力して「JWTを生成」を押すだけです。 ヘッダーは {"alg":"HS256","typ":"JWT"} の形式で自動生成され、 base64url エンコードと HMAC 署名(Web Crypto API)はすべてブラウザ内で実行されます。 プリセットボタンで iat(発行時刻)、exp(1時間後の有効期限)、sub/name のサンプル値をワンクリックで挿入できます。 既存の JWT Decoder と対になるツールで、「生成 → デコードして確認」の往復で JWT の構造を体で覚えられます。

実務での活用例

1. APIの認可ミドルウェアの単体テスト

「expが切れたトークンは401を返すか」「roleクレームがadmin以外なら403か」といった分岐をテストするには、 条件を自由に変えたトークンが何本も必要です。テスト環境のシークレット(例: test-secret)で exp切れ・クレーム欠落・別アルゴリズムのトークンを生成し、curl や Postman の Authorization: Bearer ... ヘッダーに貼って動作確認できます。

2. JWT検証ロジックの学習・デバッグ

ライブラリ任せにしていた署名検証を理解するには、自分で1本作ってみるのが早道です。 同じペイロードでもシークレットを1文字変えると署名部分(3つ目のセグメント)だけが変わること、 ペイロードを1文字変えると2つ目以降が変わることを、このツールで実際に確認できます。

3. フロントエンド開発時のモックトークン作成

バックエンドが未完成の段階で、フロントエンドのログイン状態やトークン期限切れのUIを実装したいとき、exp を過去や直近に設定したモックJWTをローカルストレージに入れて挙動を再現できます。 署名検証をしないフロントエンドのデコード処理(期限表示など)のテストデータとしても有効です。

よくあるエラーと対処 / Common Errors and Fixes

このツールでの生成時、および生成したトークンを検証側(サーバー・ライブラリ)に渡したときに起きやすい問題をまとめました。

Issues you may hit while generating a token here, or when the verifying server rejects it.

エラー / Error原因 / Cause対処 / Fix
ペイロードが有効なJSONではありません末尾カンマ・シングルクォート・コメント混入
Trailing comma, single quotes, or comments in the payload
ダブルクォートのみ・カンマ位置を修正。JSON Formatterで検証
Use double quotes only; validate with the JSON Formatter
シークレットが空ですシークレット未入力のまま生成
Generate clicked with an empty secret
テスト用の適当な文字列(例: test-secret)を入力
Enter any throwaway test string
invalid signature(検証側)検証側とシークレットのバイト列が不一致。jwt.io の「secret base64 encoded」設定差も典型
Secret bytes differ between signer and verifier; jwt.io's "secret base64 encoded" toggle is a classic cause
同じ文字列を同じ解釈(生テキスト)で使う。本ツールはシークレットをUTF-8の生バイトとして扱う
Use the same raw-text secret; this tool treats the secret as raw UTF-8 bytes
jwt expired / token expiredexp をミリ秒で指定(JWTは秒単位)
exp set in milliseconds; JWT uses seconds
Math.floor(Date.now() / 1000) + 3600 のように秒で指定。「exp = 1時間後」ボタンが正しい値を入れる
Use Unix seconds; the "exp = 1時間後" preset inserts the correct value
invalid algorithm(検証側)HS256で生成したが検証側はRS256等を想定
Token signed with HS256 but the verifier expects RS256
検証側の許可アルゴリズムに合わせてalgを選択。検証側はalgを許可リストで固定すべき
Match the verifier's allow-list; verifiers should pin accepted algorithms
日本語クレームが検証側で文字化け検証側のbase64urlデコードがUTF-8非対応(atob直読みなど)
Verifier decodes base64url without UTF-8 handling (raw atob)
TextDecoder やUTF-8対応ライブラリでデコードする
Decode with TextDecoder or a UTF-8-aware library
トークンの貼り付けで改行混入し検証失敗長いトークンをメール・チャット経由でコピーすると改行・空白が入る
Line breaks added when copying long tokens via email or chat
コピーボタンを使い1行のまま貼り付ける。JWTに改行・空白は含まれない
Use the copy button; a JWT never contains whitespace

言語別コード例 / Code Examples by Language

このツールと同じ HS256 署名付きJWT生成を各言語で再現する最小サンプルです。

Minimal snippets that produce the same HS256-signed JWT as this tool.

JavaScript (Web Crypto API / ブラウザ)

const b64u = (bytes) =>
  btoa(String.fromCharCode(...bytes))
    .replace(/\+/g, "-").replace(/\//g, "_").replace(/=+$/g, "");
const enc = new TextEncoder();

const header = b64u(enc.encode(JSON.stringify({ alg: "HS256", typ: "JWT" })));
const payload = b64u(enc.encode(JSON.stringify({ sub: "user-1" })));
const key = await crypto.subtle.importKey(
  "raw", enc.encode("test-secret"),
  { name: "HMAC", hash: "SHA-256" }, false, ["sign"]
);
const sig = await crypto.subtle.sign("HMAC", key, enc.encode(header + "." + payload));
const jwt = header + "." + payload + "." + b64u(new Uint8Array(sig));

Python (PyJWT)

import jwt  # pip install PyJWT

token = jwt.encode(
    {"sub": "user-1", "exp": 1750000000},
    "test-secret",
    algorithm="HS256",
)
print(token)

Go (golang-jwt)

import "github.com/golang-jwt/jwt/v5"

token := jwt.NewWithClaims(jwt.SigningMethodHS256, jwt.MapClaims{
    "sub": "user-1",
    "exp": 1750000000,
})
signed, err := token.SignedString([]byte("test-secret"))

Shell (openssl)

b64u() { openssl base64 -A | tr '+/' '-_' | tr -d '='; }

HEADER=$(printf '{"alg":"HS256","typ":"JWT"}' | b64u)
PAYLOAD=$(printf '{"sub":"user-1"}' | b64u)
SIG=$(printf '%s.%s' "$HEADER" "$PAYLOAD" \
  | openssl dgst -sha256 -hmac "test-secret" -binary | b64u)
echo "$HEADER.$PAYLOAD.$SIG"

Before / After 実例 / Before & After

例1: ペイロードJSON → 署名付きJWT / Payload JSON to signed JWT

alg=HS256、シークレット your-256-bit-secret で生成(jwt.io と同じ条件・同じ結果)。

{
  "sub": "1234567890",
  "name": "John Doe",
  "iat": 1516239022
}

eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJzdWIiOiIxMjM0NTY3ODkwIiwibmFtZSI6IkpvaG4gRG9lIiwiaWF0IjoxNTE2MjM5MDIyfQ.SflKxwRJSMeKKF2QT4fwpMeJf36POk6yJV_adQssw5c

例2: 同一ペイロードで HS256 と HS512 を比較 / Same payload, HS256 vs HS512

ペイロード {"sub":"user-1","role":"tester","exp":1750000000}、シークレット test-secret。 ヘッダー(1つ目)と署名(3つ目)だけが変わり、署名長は HS256 の43文字に対し HS512 は86文字になります。

HS256:
eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJzdWIiOiJ1c2VyLTEiLCJyb2xlIjoidGVzdGVyIiwiZXhwIjoxNzUwMDAwMDAwfQ.jnXWQzyK7MSVdUz7hF8LQe7EsJrSQplY10AeAnKxxu4

HS512:
eyJhbGciOiJIUzUxMiIsInR5cCI6IkpXVCJ9.eyJzdWIiOiJ1c2VyLTEiLCJyb2xlIjoidGVzdGVyIiwiZXhwIjoxNzUwMDAwMDAwfQ.ypqBzIUbxP1ryLrt4NYm_0AO-yRfPs-jXkEymNP4jhQSQtWAq1Vd41mCq-Go7LYAIy8Ok1H3F6VTPkqvzRZnog

2つ目のセグメント(ペイロード)は同一。algの違いはヘッダーと署名にのみ現れます。

The second segment (payload) is identical; only the header and the signature change with the algorithm.

例3: 標準Base64 → base64url / Standard Base64 vs base64url

Base64    : eyJzdWIiOiJ1c2VyLTEiLCJpYXQiOjE3NTAwMDAwMDB9+ABC/xyz==  (例)
base64url : eyJzdWIiOiJ1c2VyLTEiLCJpYXQiOjE3NTAwMDAwMDB9-ABC_xyz     (+→- /→_ =除去)

JWTでは + / = を含まない base64url(RFC 7515)を使います。標準Base64のままだとURLやヘッダーで壊れます。

JWT uses base64url (RFC 7515): replace + with -, / with _, and strip padding.

Why browser-only? / なぜブラウザ完結か

A JWT generator handles two sensitive things at once: the claims you put in the payload and the HMAC secret used to sign them. If a generator runs on someone else's server, both are transmitted off your machine — and a leaked HMAC secret lets an attacker mint arbitrary valid tokens for any system that shares it. This tool performs every step locally: payload encoding with TextEncoder, base64url conversion, and HMAC signing with the Web Crypto API (crypto.subtle.importKey + crypto.subtle.sign). No network request is made; you can confirm this in DevTools → Network while generating a token. Browser-only execution reduces the exposure, but it does not make pasting production secrets acceptable — clipboard history, shoulder surfing, and browser extensions are still real risks. Use throwaway test secrets here, and keep production keys in a secret manager.

JWT生成ツールはペイロードの内容とHMACシークレットという2つの機密を同時に扱います。サーバー側で動くツールに貼れば両方が外部に送信され、 シークレットが漏れればそれを共有するシステム全体で任意のトークンを偽造できてしまいます。本ツールはエンコードから署名(Web Crypto API)まで すべてブラウザ内で実行し、ネットワーク通信は発生しません(DevTools → Networkタブで検証可能)。ただしブラウザ完結であっても、 クリップボード履歴や拡張機能などのリスクは残るため、入力するのはテスト用の使い捨てシークレットに限定してください。

開発をもっと効率的に

PR