Warum gibt meine Next.js-API-Route bei der Vercel-Bereitstellung zwischengespeicherte Daten zurück?

Next.js API Route Data Cache-Problem bei der Vercel-Bereitstellung

In einer Next.js v13.2-Anwendung ruft ein API-Endpunkt Daten ab aus einer Datenbank stößt nach der Bereitstellung auf Vercel auf ein eigenartiges Verhalten. Es wird immer die gleiche Antwort zurückgegeben, was auf ein Caching-Problem hindeutet.

Ursache:

Standardmäßig speichert Next.js alle abgerufenen Daten in API-Routen und Serverkomponenten zwischen Produktion. Wenn eine Anfrage an die API-Route gestellt wird, werden die zwischengespeicherten Daten bereitgestellt, anstatt neue Daten aus der Datenbank abzurufen.

Lösungen:

1. Cache-Steuerung pro Abfrage mit fetch()

Wenn Sie die fetch()-API verwenden, können Sie das Standard-Caching-Verhalten überschreiben, indem Sie die Optionen „Revalidierung“ oder „Cache“ angeben:

• erneut validieren: Gibt die Cache-Dauer in Sekunden vor dem erneuten Abrufen von Daten an.

• Cache: Legt das Cache-Verhalten explizit fest. Zu den Optionen gehören:

  • no-store: Deaktiviert das Caching vollständig.
  • Kein Cache: Validiert den Cache erneut, bevor die Antwort bereitgestellt wird.
  • Neuladen: Ruft immer neue Daten vom Server ab.

Beispiel:

<code class="js">fetch('https://...', { next: { revalidate: 10 } });
// OR
fetch('https://...', { cache: 'no-store' });</code>

2. Routensegmentkonfiguration für allgemeines Caching

Wenn Sie fetch() nicht verwenden oder das Caching auf Routensegmentebene steuern müssen, verwenden Sie Route Segment Config:

• DYNAMISCHES SEGMENT hinzufügen: Export hinzufügen constdynamic = "force-dynamic"; zu Ihrem Layout, Ihrer Seite oder Ihrer Routendatei hinzufügen. Dadurch wird das Cache-Verhalten für dieses Segment deaktiviert.

Beispiel:

<code class="js">// layout.js OR page.js OR route.js

import prisma from "./lib/prisma";

export const dynamic = "force-dynamic";

async function getPosts() {
  const posts = await prisma.post.findMany();
  return posts;
}

export default async function Page() {
  const posts = await getPosts();
  // ...
}</code>

Das obige ist der detaillierte Inhalt vonWarum gibt meine Next.js-API-Route bei der Vercel-Bereitstellung zwischengespeicherte Daten zurück?. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!