コンテンツにスキップ

connection

connection() 関数を使用すると、ユーザーからのリクエストを待ってからレンダリングを続行するように指示できます。

これは、コンポーネントがDynamic APIsを使用しないものの、ビルド時に静的にレンダリングされるのではなく、実行時に動的にレンダリングしたい場合に役立ちます。これは通常、レンダリング結果を意図的に変更したい外部情報(例: Math.random()new Date())にアクセスする場合に発生します。

app/page.tsx
import { connection } from 'next/server'
 
export default async function Page() {
  await connection()
  // Everything below will be excluded from prerendering
  const rand = Math.random()
  return <span>{rand}</span>
}

リファレンス

Type

function connection(): Promise<void>

Parameters

  • この関数はパラメータを受け取りません。

戻り値

  • この関数は void Promise を返します。これは消費されることを意図していません。

Good to know

  • connectionunstable_noStore を置き換え、Next.js の将来の方向性に沿うように設計されています。
  • この関数は、動的レンダリングが必要で、一般的な Dynamic API が使用されていない場合にのみ必要です。

バージョン履歴

バージョン変更履歴
v15.0.0connection が安定化されました。
v15.0.0-RCconnection が導入されました。