オンデマンド再検証により、時間ベースの間隔を待つのではなく、データが変更されたちょうどそのタイミングでキャッシュ/静的ページを無効化することができます。これは時間ベースの ISR (revalidate: N) の正確な補完です。
なぜ重要なのか
tsx
revalidate = ;
時間ベースの ISR はシンプルですが不完全です。間隔が短すぎると = 不要な再生成、長すぎると = 古いコンテンツ。オンデマンド再検証は、変更が実際に発生したときにあなたのコードから再検証をトリガーすることでこれを解決します。
import { revalidatePath, revalidateTag } from "next/cache";
// 1. Tag your fetches, then invalidate by tag
await fetch("https://api/posts", { next: { tags: ["posts"] } });
revalidateTag("posts"); // refresh EVERY page/fetch tagged "posts"
// 2. Or invalidate a specific path
revalidatePath("/blog/my-post");
// app/api/revalidate/route.ts — called by your CMS when an editor publishes
import { revalidateTag } from "next/cache";
import { NextRequest, NextResponse } from "next/server";
export async function POST(req: NextRequest) {
const secret = req.nextUrl.searchParams.get("secret");
if (secret !== process.env.REVALIDATE_SECRET) { // verify it's really your CMS
return NextResponse.json({ ok: false }, { status: 401 });
}
revalidateTag("posts"); // rebuild affected pages now
return NextResponse.json({ revalidated: true });
}
フロー: エディタが CMS で公開 → CMS がウェブフックを呼び出し → revalidateTag("posts") がキャッシュを無効化 → 次の訪問者が新しく再生成された静的 HTML を取得。ページは静的な高速性を保ちながら公開時に即座に更新されます。
"use server";
export async function createPost(data) {
await db.post.create({ data });
revalidateTag("posts"); // user sees their new post immediately
}
オンデマンド再検証により、究極の目標が達成されます: リアルタイムな鮮度を持つ静的パフォーマンス。
再検証間隔を推測する代わりに、コンテンツが変更されたちょうどそのタイミングで — ウェブフック (CMS 公開) または Server Action ミューテーション後に — revalidateTag/revalidatePath を使用して正確に無効化します。
これにより、古いコンテンツと無駄な過度な再生成の両方が排除され、予測不可能な更新を行うコンテンツに対して ISR が実用的になります。