permanentRedirect

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

ストリーミングコンテキストで使用すると、クライアントサイドでリダイレクトを発生させるための meta タグが挿入されます。サーバーアクションで使用すると、呼び出し元に 303 HTTP リダイレクトレスポンスが返されます。それ以外の場合は、呼び出し元に 308(恒久的)HTTP リダイレクトレスポンスが返されます。

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

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

パラメータ

permanentRedirect 関数は2つの引数を受け取ります:

permanentRedirect(path, type)
パラメータタイプ説明
pathstringリダイレクト先の URL。相対パスまたは絶対パスを指定できます。
type'replace' (デフォルト) または 'push' (Server Actions ではデフォルト)実行するリダイレクトのタイプ。

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

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

戻り値

permanentRedirect は値を返しません。

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

app/team/[id]/page.js
import { permanentRedirect } 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 { id } = await params
  const team = await fetchTeam(id)
  if (!team) {
    permanentRedirect('/login')
  }

  // ...
}

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

On this page