revalidateTag() – Invalidarea țintită a cache-ului după etichete în Next.js

Invalidează instant toate cererile de date marcate cu o anumită etichetă (tag), indiferent pe ce pagini din site sunt afișate.

Sintaxă
// În interogare:
fetch(url, { next: { tags: ['produse'] } })

// În acțiunea de mutare:
import { revalidateTag } from 'next/cache';
revalidateTag('produse');

Ce face revalidateTag() - Invalidarea țintită a cache-ului după etichete

Tag-urile de cache oferă un nivel chirurgical de control asupra memoriei cache din Next.js.

Puteți eticheta cererile `fetch` cu unul sau mai multe tag-uri semantice (de exemplu `tags: [‘catalog’, ‘produs-42’]`).

Când produsul 42 este modificat în panoul de administrare, un simplu apel revalidateTag('produs-42') va purja din cache acel produs din toate paginile site-ului (pagina dedicată, caruselul de pe prima pagină, căutarea), fără a re-genera inutil restul catalogului.

Exemple

Exemplul 1: Webhook pentru actualizarea automată a produselor la modificări în CMS

Invalidează cache-ul prin webhook când se trimite semnal din backend.

import { NextResponse } from 'next/server';
import { revalidateTag } from 'next/cache';

export async function POST(request: Request) {
  const secret = request.headers.get('x-webhook-secret');
  if (secret !== process.env.WEBHOOK_SECRET) {
    return NextResponse.json({ eroare: 'Neautorizat' }, { status: 401 });
  }

  // Purjează doar datele legate de utilizatori:
  revalidateTag('utilizatori');
  return NextResponse.json({ revalidat: True });
}

Ieșire în terminal

Toate datele asociate cu tag-ul 'utilizatori' sunt reîmprospătate.

Greșeli frecvente

  • Utilizarea numelor de tag-uri prea generice (ex: ‘date’) care vor invalida neintenționat întregul cache al aplicației.

Comenzi înrudite