Menu

connection

connection() 関数を使用すると、受信したユーザーリクエストを待ってからレンダリングを続行することを指定できます。

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

app/page.tsx
TypeScript
import { connection } from 'next/server'
 
export default async function Page() {
  await connection()
  // 以下のすべてはプリレンダリングから除外されます
  const rand = Math.random()
  return <span>{rand}</span>
}

リファレンス

function connection(): Promise<void>

パラメータ

  • 関数はパラメータを受け付けません。

戻り値

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

補足

  • connectionunstable_noStore に代わるもので、Next.js の将来の方向性とより適合するように設計されています。
  • この関数は動的レンダリングが必要で、一般的な Dynamic APIs が使用されていない場合にのみ必要です。

バージョン履歴

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