Πώς λειτουργεί η επαναεπικύρωση κατά ζήτηση (ISR);

Question

Accepted Answer

**Η επαναεπικύρωση κατά ζήτηση** σας επιτρέπει να ακυρώσετε σελίδες με cache/στατικές σελίδες **ακριβώς όταν αλλάζουν τα δεδομένα** — αντί να περιμένετε ένα διάστημα βασισμένο στο χρόνο. Είναι το ακριβές συμπλήρωμα της χρονικής ISR (`revalidate: N`).

## Βασισμένη στο χρόνο έναντι κατά ζήτηση

```tsx
// Time-based: page refreshes on a fixed schedule (may serve stale data up to N seconds)
export const revalidate = 3600; // every hour

// On-demand: refresh the INSTANT the underlying data changes — no waiting, no waste
```

Η χρονική ISR είναι απλή αλλά ελλιπής: πολύ σύντομη = περιττή αναγέννηση· πολύ μεγάλη = παλιό περιεχόμενο. Η κατά ζήτηση επαναεπικύρωση το διορθώνει ενεργοποιώντας την επαναεπικύρωση από τον δικό σας κώδικα όταν συμβαίνει πραγματικά μια αλλαγή.

## Τα δύο API κατά ζήτηση

```tsx
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");
```

## Ένα πραγματικό workflow: CMS webhook

```ts
// 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 καλεί το webhook σας → `revalidateTag("posts")` ακυρώνει την cache → ο επόμενος επισκέπτης παίρνει ανανεωμένο στατικό HTML. Οι σελίδες παραμένουν στατικά γρήγορες **και** ενημερώνονται αμέσως κατά τη δημοσίευση.

## Μετά από μια μετάλλαξη Server Action

```tsx
"use server";
export async function createPost(data) {
  await db.post.create({ data });
  revalidateTag("posts"); // user sees their new post immediately
}
```

## Γιατί είναι σημαντικό

Η επαναεπικύρωση κατά ζήτηση σας δίνει το ιδανικό αποτέλεσμα: **στατική απόδοση με πραγματική φρεσκάδα δεδομένων**.

Αντί να μαντέψετε ένα διάστημα επαναεπικύρωσης, ακυρώνετε ακριβώς όταν αλλάζει το περιεχόμενο — μέσω webhooks (δημοσίευση CMS) ή μετά από μεταλλάξεις Server Action — χρησιμοποιώντας `revalidateTag`/`revalidatePath`.

Εξαλείφει τόσο το παλιό περιεχόμενο όσο και τη σπατάλη από υπερβολική αναγέννηση, καθιστώντας την ISR πρακτική για περιεχόμενο που ενημερώνεται απρόβλεπτα.