revalidateTag

revalidateTag를 사용하면 특정 캐시 태그에 대한 캐시된 데이터를 필요에 따라 제거할 수 있습니다.

알아두면 좋은 점:

revalidateTag는 Node.js 및 Edge 런타임 모두에서 사용 가능합니다.

revalidateTag는 경로가 다음에 방문될 때만 캐시를 무효화합니다. 이는 동적 라우트 세그먼트로 revalidateTag를 호출해도 한 번에 많은 재검증을 즉시 트리거하지 않는다는 의미입니다. 무효화는 경로가 다음에 방문될 때만 발생합니다.

매개변수

revalidateTag(tag: string): void;

tag: 재검증하려는 데이터와 관련된 캐시 태그를 나타내는 문자열입니다. 256자 이하여야 합니다. 이 값은 대소문자를 구분합니다.

다음과 같이 fetch에 태그를 추가할 수 있습니다:

fetch(url, { next: { tags: [...] } });

반환값

revalidateTag는 값을 반환하지 않습니다.

예시

서버 액션

app/actions.ts

"use server";
 
import { revalidateTag } from "next/cache";
 
export default async function submit() {
  await addPost();
  revalidateTag("posts");
}

app/actions.js

"use server";
 
import { revalidateTag } from "next/cache";
 
export default async function submit() {
  await addPost();
  revalidateTag("posts");
}

라우트 핸들러

app/api/revalidate/route.ts

import type { NextRequest } from "next/server";
import { revalidateTag } from "next/cache";
 
export async function GET(request: NextRequest) {
  const tag = request.nextUrl.searchParams.get("tag");
  revalidateTag(tag);
  return Response.json({ revalidated: true, now: Date.now() });
}

app/api/revalidate/route.js

import { revalidateTag } from "next/cache";
 
export async function GET(request) {
  const tag = request.nextUrl.searchParams.get("tag");
  revalidateTag(tag);
  return Response.json({ revalidated: true, now: Date.now() });
}

revalidatePath unstableAfter