connection

connection() 関数は、レンダリングが進む前にユーザーリクエストの受信を待機することを示すのに役立ちます。

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

TypeScript

app/page.tsx

import { connection } from 'next/server'

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

JavaScript

app/page.js

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 を返します。これは消費されることを意図していません

Good to know

• connection は unstable_noStore の代わりに導入され、Next.js の将来により適合しています
• Dynamic APIs が一般的に使用されない場合にのみ動的レンダリングが必要なときに、関数が必要です

バージョン履歴

バージョン	変更内容
v15.0.0-RC	connectionが導入されました