redirect

redirect関数を使用すると、ユーザーを別のURLにリダイレクトできます。redirectはサーバーコンポーネント、クライアントコンポーネント、Route Handlers（ルートハンドラ）、およびServer Actions（サーバーアクション）で使用可能です。

ストリーミングコンテキストで使用すると、クライアントサイドでリダイレクトを実行するためのmetaタグが挿入されます。それ以外の場合は、呼び出し元に307 HTTPリダイレクトレスポンスを返します。

リソースが存在しない場合は、代わりにnotFound関数を使用できます。

豆知識: 307（一時的）ではなく308（恒久的）HTTPリダイレクトを返したい場合は、代わりにpermanentRedirect関数を使用できます。

パラメータ

redirect関数は2つの引数を受け取ります：

redirect(path, type)

デフォルトでは、redirectはServer Actions（サーバーアクション）ではpush（ブラウザの履歴スタックに新しいエントリを追加）を、それ以外の場所ではreplace（ブラウザの履歴スタックで現在のURLを置換）を使用します。typeパラメータを指定することでこの動作を上書きできます。

typeパラメータはサーバーコンポーネントで使用した場合には効果がありません。

戻り値

redirectは値を返しません。

例

redirect()関数を呼び出すとNEXT_REDIRECTエラーがスローされ、スローされたルートセグメントのレンダリングが終了します。

import { redirect } from 'next/navigation'

async function fetchTeam(id) {
  const res = await fetch('https://...')
  if (!res.ok) return undefined
  return res.json()
}

export default async function Profile({ params }) {
  const team = await fetchTeam(params.id)
  if (!team) {
    redirect('/login')
  }

  // ...
}

豆知識: redirectはTypeScriptのnever型を使用しているため、return redirect()と記述する必要はありません。