Next.js middleware.ts 仕様メモ

1. middleware.ts の有効化条件

• Next.js では、**プロジェクトルート配下の middleware.ts（または middleware.js）**を特別なエントリとして認識する。
• このファイルが存在すると Middleware が有効になり、リクエスト処理の前段で実行される。

2. いつ実行されるか

• Middleware は、config.matcher に一致したパスへのリクエスト時に実行される。
• 現在の実装では次のパスが対象：
  • /manager/:path*
  • /admin/:path*
• そのため /manager と /admin 配下へのアクセスごとに発火する。

3. 「サーバーに飛ぶリクエスト」とは

• ここでいう「サーバーに飛ぶ」は、ブラウザが実際に HTTP リクエストを送ること。
• Middleware は、描画イベントそのものではなく、HTTP リクエスト発生時に実行される。

実行される例

• URL を直打ちして /manager/... を開く
• ページを再読み込みする（F5）
• 画面遷移時に Next.js がサーバーへデータ取得リクエストを送る

実行されない例

• useState によるローカル状態更新だけ
• モーダル開閉など、通信を伴わない UI 操作

4. 現在の frontend/middleware.ts の挙動

export function middleware(request: NextRequest) {
  if (process.env.NODE_ENV !== 'production') {
    console.info('[middleware] request', { ... });
  }

  return NextResponse.next();
}

• 本番以外（NODE_ENV !== 'production'）で、リクエスト情報をログ出力する。
• 最後に NextResponse.next() を返しているため、リクエストをそのまま通過させる。
• 現時点では認可やリダイレクトは行っていない。

5. よくある用途（ベストプラクティス）

• 認証状態によるページ遷移制御（未ログイン時のログイン画面リダイレクト）
• URL 正規化（末尾スラッシュ、言語プレフィックスなど）
• A/B テストや feature flag の初期判定

運用上の注意

• Middleware はリクエストごとに走るため、重い処理や外部 I/O を避ける。
• ログは開発環境に限定し、本番では最小限にする。
• matcher は必要最小限に絞って、不要な経路での実行を防ぐ。