revalidatePath

何をする関数か

revalidatePath は指定したパスのキャッシュを即時無効化する関数です。Server Action や Route Handler でデータを更新したあとに呼ぶことで、次のリクエスト時に最新データが再取得されます。

"use server";
import { revalidatePath } from "next/cache";

export async function updatePost(id: string) {
  await db.post.update({ where: { id }, data: { ... } });
  revalidatePath("/posts");         // 一覧を無効化
  revalidatePath(`/posts/${id}`);  // 詳細も無効化
}

どんな場面で使うか

• 管理画面・編集フォームで記事を更新したあと、一覧・詳細ページを即時反映させたいとき
• Server Action の完了後に特定ルートを再描画させたいとき

よくある組み合わせ

第 2 引数でスコープを指定

revalidatePath("/posts");            // デフォルト（page）
revalidatePath("/posts/[id]", "page");   // ページ単位
revalidatePath("/", "layout");           // レイアウト配下すべて（影響範囲が広い）

第 2 引数を省略すると "page" 相当になります。"layout" はそのレイアウト配下のすべてのページを無効化するため、使う範囲に注意が必要です。

注意点

• Server Action・Route Handler・Server Component の中でのみ呼べる（クライアントコンポーネントでは使えない）
• 動的ルート（/posts/[id]）でもパスパターン文字列ではなく実際のパス（/posts/42）を渡す
• 複数ページにまたがるデータを一括無効化したい場合は revalidateTag との使い分けを検討する

revalidatePath を含むキャッシュ設計の全体像は → Next.js キャッシュ設計