Menu

unstable_after

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

サーバーコンポーネントgenerateMetadata を含む)、サーバーアクションルートハンドラーミドルウェアで使用できます。

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

app/layout.tsx
TypeScript
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}</>
}

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

リファレンス

パラメーター

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

サーバーレス関数の継続時間

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

補足

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

代替手段

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

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

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

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