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

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が呼ばれたときも含みます。
  • React cacheを使用して、unstable_after内で呼び出される関数を重複排除できます。
  • cookiesは、レスポンスがすでに送信されているため、unstable_after内部で設定できません。
  • 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が導入されました