Incremental Static Regeneration (ISR) Internals

1// Route Segment Configuration: Revalidate this page every 120 seconds
2export const revalidate = 120;
3
4export default async function BlogPostPage({ params }: { params: Promise<{ slug: string }> }) {
5  const { slug } = await params;
6  
7  // Data fetch inherits the route revalidation interval or overrides it
8  const post = await fetch(`https://api.cms.com/posts/${slug}`, {
9    next: { tags: [`post-${slug}`, 'posts'] }
10  }).then(res => res.json());
11
12  return (
13    <article>
14      <h1>{post.title}</h1>
15      <time dateTime={post.updatedAt}>{post.updatedAt}</time>
16      <div dangerouslySetInnerHTML={{ __html: post.content }} />
17    </article>
18  );
19}
20
21// On-demand invalidation via Route Handler (e.g. CMS Webhook)
22// app/api/revalidate/route.ts
23import { revalidateTag } from 'next/cache';
24import { NextRequest, NextResponse } from 'next/server';
25
26export async function POST(req: NextRequest) {
27  const secret = req.nextUrl.searchParams.get('secret');
28  if (secret !== process.env.REVALIDATION_SECRET) {
29    return NextResponse.json({ message: 'Invalid token' }, { status: 401 });
30  }
31
32  const tag = req.nextUrl.searchParams.get('tag');
33  if (tag) {
34    revalidateTag(tag); // Purges cache across edge CDNs on demand
35    return NextResponse.json({ revalidated: true, tag });
36  }
37
38  return NextResponse.json({ message: 'Missing tag' }, { status: 400 });
39}