メインコンテンツまでスキップ

unstable_after

unstable_afterは、レスポンス（またはプリレンダー）が完了した後に実行する作業をスケジュールすることを可能にします。これは、ログ記録や分析のように、レスポンスをブロックすべきでないタスクやその他の副作用に役立ちます。

これはServer Components（generateMetadataを含む）、Server Actions、Route Handlers、およびMiddlewareで使用できます。

この関数は、レスポンス（またはプリレンダー）完了後に実行されるコールバックを受け取ります：

import { unstable_after as after } from 'next/server'
// カスタムログ関数
import { log } from '@/app/utils'

export default function Layout({ children }: { children: React.ReactNode }) {
  after(() => {
    // レイアウトがレンダリングされ、ユーザーに送信された後に実行されます
    log()
  })
  return <>{children}</>
}
import { unstable_after as after } from 'next/server'
// カスタムログ関数
import { log } from '@/app/utils'

export default function Layout({ children }) {
  after(() => {
    // レイアウトがレンダリングされ、ユーザーに送信された後に実行されます
    log()
  })
  return <>{children}</>
}

Good to know: unstable_afterはDynamic APIではなく、それを呼び出してもルートが動的になることはありません。静的ページ内で使用される場合、コールバックはビルド時またはページが再検証されるたびに実行されます。

参照​

パラメータ​

  • レスポンス（またはプリレンダー）が完了した後に実行されるコールバック関数

サーバーレス関数の持続時間​

unstable_afterは、プラットフォームのデフォルトまたは設定されたサーバーレス関数の最大持続時間で実行されます。プラットフォームが対応している場合は、maxDurationルートセグメントの設定を使用してタイムアウト制限を設定できます。

Good to know​

  • レスポンスが正常に完了しなかった場合でもunstable_afterは実行されます。エラーがスローされた場合やnotFoundやredirectが呼び出された場合も含まれます。
  • unstable_after内で呼び出される関数を重複除去するために、Reactのcacheを使用できます。
  • レスポンスがすでに送信されているため、unstable_after内でcookiesを設定することはできません。
  • Dynamic APIsをunstable_after内で呼び出すことはできません。それをunstable_afterの外で呼び出し、そのオブジェクトを使用してください。
  • unstable_afterは、他のunstable_after呼び出しの内部にネストすることができ、例えば、追加の機能を追加するためのunstable_after呼び出しをラップするユーティリティ関数を作成することができます。

代替案​

unstable_afterの使用ケースは、主なレスポンスをブロックせずに二次的タスクを処理することです。これはプラットフォームのwaitUntil()を使用したり、プロミスからawaitを削除したりする方法に似ていますが、次の違いがあります：

  • waitUntil(): プロミスを受け取り、リクエストのライフサイクル中に実行されるタスクをキューに入れますが、unstable_afterはレスポンス完了後に実行されるコールバックを受け取ります。
  • awaitを削除する: レスポンスの間に実行を開始し、リソースを使用します。サーバーレス環境では、レスポンスが送信されると計算が即座に停止されるため、タスクが中断される可能性があり、信頼性がありません。

unstable_afterは、他のNext.jsのAPIやコンテキストを考慮して設計されているため、使用をおすすめします。

バージョン履歴説明
v15.0.0-rcunstable_afterが導入されました。