メインコンテンツまでスキップ

permanentRedirect

permanentRedirect 関数は、ユーザーを別の URL にリダイレクトすることを可能にします。permanentRedirect は Server Components、Client Components、Route Handlers、および Server Actions で使用できます。

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

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

Good to know: もし308 (Permanent) の代わりに307 (Temporary) HTTPリダイレクトを返したい場合は、代わりに redirect 関数 を使用できます。

Parameters​

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

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

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

type パラメータは Server Components で使用されると効果がありません。

Returns​

permanentRedirect は値を返しません。

Example​

permanentRedirect() 関数を呼び出すと、NEXT_REDIRECT エラーを投げ、その呼び出しが行われた route segment のレンダリングを終了します。

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 team = await fetchTeam(params.id)
  if (!team) {
    permanentRedirect('/login')
  }

  // ...
}

Good to know: permanentRedirect は、 TypeScript の never 型を使用するため、return permanentRedirect() とする必要はありません。