ホームページ >ウェブフロントエンド >jsチュートリアル >API エンドポイント データが Next.js にキャッシュされないようにするにはどうすればよいですか?

API エンドポイント データが Next.js にキャッシュされないようにするにはどうすればよいですか?

Susan Sarandon
Susan Sarandonオリジナル
2024-11-01 12:34:29519ブラウズ

How to Prevent API Endpoint Data From Being Cached in Next.js?

API エンドポイント データが Next.js にキャッシュされないようにする方法

Next.js v13.2 では、Route を使用した新しいアプリ ディレクトリが採用されていますハンドラー。運用環境では、フレームワークは API エンドポイントとサーバー コンポーネントから取得したデータを自動的にキャッシュします。これにより、バックエンド データが更新されると不整合が生じる可能性があります。

解決策 1: フェッチ オプションを変更する

特定のフェッチ クエリのキャッシュを無効にするには、再検証またはキャッシュ オプションをfetch() 関数:

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

解決策 2: ルート セグメント設定を使用する

他のライブラリ (axios、ORM など) で使用するか、またはルート セグメント キャッシュ設定。ルート セグメント設定の利用を検討してください:

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

import prisma from './lib/prisma';

/*
  Force dynamic behavior, there are more options available depending on your requirement.
*/
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>

以上がAPI エンドポイント データが Next.js にキャッシュされないようにするにはどうすればよいですか?の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。

声明:
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。