コンテンツへスキップ

unstable_cacheこのAPIは現在不安定であり、変更される可能性があります。

このAPIは現在不安定であり、変更される可能性があります。

unstable_cacheを使用すると、データベースクエリなどのコストのかかる操作の結果をキャッシュし、複数のリクエストで再利用できます。

import { getUser } from './data';
import { unstable_cache } from 'next/cache';
 
const getCachedUser = unstable_cache(
  async (id) => getUser(id),
  ['my-app-user']
);
 
export default async function Component({ userID }) {
  const user = await getCachedUser(userID);
  ...
}

知っておくと良い点:

  • キャッシュスコープ内でheaderscookiesなどの動的データソースにアクセスすることはサポートされていません。キャッシュされた関数内でこれらのデータが必要な場合は、キャッシュされた関数の外でheadersを使用し、必要な動的データを引数として渡してください。
  • このAPIは、Next.jsの組み込みデータキャッシュを使用して、リクエストとデプロイメント間で結果を永続化します。

警告: このAPIは不安定であり、将来変更される可能性があります。このAPIが安定した後は、必要に応じて移行ドキュメントとCodemodsを提供します。

パラメータ

const data = unstable_cache(fetchData, keyParts, options)()
  • fetchData: キャッシュするデータをフェッチする非同期関数です。`Promise`を返す関数である必要があります。
  • keyParts: キャッシュへの識別をさらに追加するキーの追加配列です。デフォルトでは、`unstable_cache`は既に引数と関数の文字列表現をキャッシュキーとして使用しています。ほとんどの場合オプションです。外部変数をパラメータとして渡さずに使用する必要がある場合のみ使用します。ただし、パラメータとして渡さない場合、関数内で使用されるクロージャを追加することが重要です。
  • options: キャッシュの動作を制御するオブジェクトです。次のプロパティを含めることができます。
    • tags: キャッシュの無効化を制御するために使用できるタグの配列です。Next.jsはこれを関数の一意の識別に使用しません。
    • revalidate: キャッシュを再検証するまでの秒数です。無期限に、または一致する`revalidateTag()`または`revalidatePath()`メソッドが呼び出されるまでキャッシュするには、省略するか`false`を渡します。

戻り値

unstable_cache は、呼び出されるとキャッシュされたデータに解決されるPromiseを返す関数を返します。データがキャッシュにない場合、指定された関数が呼び出され、その結果がキャッシュされて返されます。

app/page.tsx
import { unstable_cache } from 'next/cache'
 
export default async function Page({ params }: { params: { userId: string } }) {
  const getCachedUser = unstable_cache(
    async () => {
      return { id: params.userId }
    },
    [params.userId], // add the user ID to the cache key
    {
      tags: ['users'],
      revalidate: 60,
    }
  )
 
  //...
}

バージョン履歴

バージョン変更点
v14.0.0unstable_cache が導入されました。