Menu
CoddyTech

トークンへの署名

CoddyのNode.jsジャーニー「認証とセキュリティ」セクションの一部。レッスン 15/24。

トークンに価値があるのは、ほかの誰にも作れない場合だけです。HS256では、joseがヘッダーとペイロードをサーバーだけが知っている秘密鍵と組み合わせ、その結果をハッシュ化します。そのハッシュが署名です。秘密鍵がなければ、一致する署名を作ることはできません。

秘密鍵は環境変数process.env.JWT_SECRETから取得し、コードからは取得しません。コードは共有、コピー、コミットされるためです。このレッスンでは、JWT_SECRETを設定します。joseはこれをバイト列として必要とします。

const key = new TextEncoder().encode(process.env.INVITE_SECRET);

const invite = await new SignJWT({ room: 'design' })
    .setProtectedHeader({ alg: 'HS256' })
    .setSubject(guestId)
    .setIssuedAt()
    .setExpirationTime('2d')
    .sign(key);

setSubjectにはテキストを渡し、setExpirationTimeには'30m'や'2d'のような期間を渡します。

challenge icon

チャレンジ

簡単

電話アプリのようにAPIを呼び出すアプリは、ブラウザーのようにCookieを保持しません。代わりにトークンを渡します。署名付きJWTを、リクエストごとに送信してもらいます。POST /tokenは、そうしたアプリのログイン用です。

  1. server.jsで、decodeJwtの隣にjoseからSignJWTをインポートします。ルートの上で、このレッスンで示すように、process.env.JWT_SECRETをTextEncoderでバイト列に変換します。joseはバイト列を使って署名するためです。このレッスンでは、JWT_SECRETを設定してあります。
  2. POST /tokenを追加します。ログインと同じ本文{"username": "ada", "password": "correct horse"}を受け取り、POST /loginと同じ方法でユーザー名とパスワードを確認します。間違っていた場合は、ステータス401と{"error": "Wrong username or password"}を返します。
  3. 正しければ、トークンに署名し、{"token": "..."}として返します。トークンは次の条件を満たす必要があります。
    • アルゴリズムHS256を使用し、JWT_SECRETのバイト列で署名する。
    • ペイロードにクレームusernameを含める。
    • サブジェクトを、文字列にしたユーザーの_idにする。joseは文字列でないサブジェクトを拒否するため、toHexString()を使います。
    • 作成から1時間後に有効期限が切れる。

    このレッスンで作成されるトークンは、次のような形式です。eyJhbGciOiJIUzI1NiJ9.eyJ1c2VybmFtZSI6ImFkYSIsInN1YiI6IjY2ZjFjMmE5ZTRiMGExYjJjM2Q0ZTVmNiIsImlhdCI6MTc5MzM2MTYwMCwiZXhwIjoxNzkzMzY1MjAwfQ.EdCrjAKSjZowcjE3-IjKttBLVK1VKKbL9DPnJDLdgug

試してみましょう:「プレイ」を押します。POST /signupに{"username": "ada", "password": "correct horse"}を送信します。同じ本文でPOST /tokenを送信すると、ステータス200と{"token": "..."}が返ります。トークンをコピーして、GET /inspect?token=の後ろに付けて送信します。次のような内容が表示されます。{"username": "ada", "sub": "66f1c2a9e4b0a1b2c3d4e5f6", "iat": 1793361600, "exp": 1793365200}。expはiatの3600秒後です。{"username": "ada", "password": "wrong horse"}を使ってPOST /tokenを送信すると、ステータス401が返ります。

自分で試してみよう

import express from 'express';
import { decodeJwt } from 'jose';
import { users } from './db.js';
import { hashPassword, verifyPassword } from './passwords.js';

const app = express();
app.use(express.json());

app.post('/signup', async (req, res) => {
    const username = String(req.body.username ?? '').trim().toLowerCase();
    const password = String(req.body.password ?? '');
    if (!username || password.length < 8) {
        return res.status(400).json({ error: 'Pick a username and a password of at least 8 characters' });
    }
    if (await users.findOne({ username })) {
        return res.status(409).json({ error: 'That username is taken' });
    }
    await users.insertOne({ username, passwordHash: await hashPassword(password) });
    res.status(201).json({ username });
});

app.post('/login', async (req, res) => {
    const username = String(req.body.username ?? '').trim().toLowerCase();
    const user = await users.findOne({ username });
    if (!user || !(await verifyPassword(String(req.body.password ?? ''), user.passwordHash))) {
        return res.status(401).json({ error: 'Wrong username or password' });
    }
    res.json({ username: user.username });
});

// トークンの内容を表示する: GET /inspect?token=...
app.get('/inspect', (req, res) => {
    try {
        res.json(decodeJwt(String(req.query.token ?? '')));
    } catch {
        res.status(400).json({ error: 'Not a JWT' });
    }
});

// 管理者ページ。署名が検証されるまでは、どのクレームも信頼できない。
app.get('/admin', (req, res) => {
    res.status(403).json({ error: 'Admins only' });
});

app.listen(3000, () => {
    console.log('Vault is running on port 3000');
});

認証とセキュリティのすべてのレッスン

自分で練習してみよう: Expressプレイグラウンド