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ámetro | Tipo | Descripción |
---|---|---|
path | string | URL 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ó.
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 usarreturn redirect()
ya que utiliza el tiponever
de TypeScript.
Versión | Cambios |
---|---|
v13.0.0 | Se introdujo redirect . |