redirect

La función redirect permite redirigir al usuario a otra URL. Se puede utilizar en Componentes del Servidor, Componentes del Cliente, Manejadores de Ruta y Acciones del Servidor.

Cuando se usa en un contexto de transmisión en flujo (streaming), inserta una etiqueta meta para emitir la redirección en el lado del cliente. De lo contrario, devuelve una respuesta de redirección HTTP 307 al solicitante.

Si un recurso no existe, puede utilizar la función notFound en su lugar.

Nota importante: Si prefiere devolver una redirección HTTP 308 (Permanente) en lugar de 307 (Temporal), puede usar la función permanentRedirect.

Parámetros

La función redirect acepta dos argumentos:

redirect(path, type)
ParámetroTipoDescripción
pathstringURL de destino. Puede ser una ruta relativa o absoluta.
type'replace' (predeterminado) o 'push' (predeterminado en Acciones del Servidor)Tipo de redirección a realizar.

Por defecto, redirect usará push (añade una nueva entrada al historial del navegador) en Acciones del Servidor y replace (reemplaza la URL actual en el historial del navegador) en otros casos. Puede sobrescribir este comportamiento especificando el parámetro type.

El parámetro type no tiene efecto cuando se usa en Componentes del Servidor.

Valor de retorno

redirect no devuelve ningún valor.

Ejemplo

Invocar la función redirect() lanza un error NEXT_REDIRECT y termina el renderizado del segmento de ruta donde se lanzó.

app/team/[id]/page.js
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')
  }

  // ...
}

Nota importante: redirect no requiere usar return redirect() ya que utiliza el tipo never de TypeScript.

VersiónCambios
v13.0.0Se introdujo redirect.