Menu

permanentRedirect

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

ストリーミングコンテキストで使用する場合、クライアント側でリダイレクトを発行するmetaタグを挿入します。サーバーアクション内で使用する場合、呼び出し元に303 HTTPリダイレクト応答を送信します。それ以外の場合は、呼び出し元に308(永続的)HTTPリダイレクト応答を送信します。

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

補足: 308(永続的)HTTPリダイレクトの代わりに307(一時的)HTTPリダイレクトを返したい場合は、代わりにredirect関数を使用できます。

パラメータ

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

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

デフォルトでは、permanentRedirectサーバーアクションでは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 team = await fetchTeam(params.id)
  if (!team) {
    permanentRedirect('/login')
  }
 
  // ...
}

補足: permanentRedirectは、TypeScript never型を使用するため、return permanentRedirect()を使用する必要はありません。