NextResponse

NextResponse extiende la API de Respuesta Web con métodos convenientes adicionales.

`cookies`

Lee o modifica el encabezado Set-Cookie de la respuesta.

`set(nombre, valor)`

Dado un nombre, establece una cookie con el valor especificado en la respuesta.

// Dada una solicitud entrante /home
let response = NextResponse.next()
// Establece una cookie para ocultar el banner
response.cookies.set('show-banner', 'false')
// La respuesta tendrá un encabezado `Set-Cookie:show-banner=false;path=/home`
return response

`get(nombre)`

Dado un nombre de cookie, devuelve su valor. Si no se encuentra la cookie, devuelve undefined. Si hay múltiples cookies, devuelve la primera.

// Dada una solicitud entrante /home
let response = NextResponse.next()
// { name: 'show-banner', value: 'false', Path: '/home' }
response.cookies.get('show-banner')

`getAll()`

Dado un nombre de cookie, devuelve sus valores. Si no se especifica nombre, devuelve todas las cookies de la respuesta.

// Dada una solicitud entrante /home
let response = NextResponse.next()
// [
//   { name: 'experiments', value: 'new-pricing-page', Path: '/home' },
//   { name: 'experiments', value: 'winter-launch', Path: '/home' },
// ]
response.cookies.getAll('experiments')
// Alternativamente, obtener todas las cookies de la respuesta
response.cookies.getAll()

`delete(nombre)`

Dado un nombre de cookie, elimínala de la respuesta.

// Dada una solicitud entrante /home
let response = NextResponse.next()
// Devuelve true si se eliminó, false si no había nada que eliminar
response.cookies.delete('experiments')

`json()`

Genera una respuesta con el cuerpo JSON especificado.

import { NextResponse } from 'next/server'

export async function GET(request: Request) {
  return NextResponse.json({ error: 'Internal Server Error' }, { status: 500 })
}

import { NextResponse } from 'next/server'

export async function GET(request) {
  return NextResponse.json({ error: 'Internal Server Error' }, { status: 500 })
}

`redirect()`

Genera una respuesta que redirige a una URL.

import { NextResponse } from 'next/server'

return NextResponse.redirect(new URL('/new', request.url))

La URL puede crearse y modificarse antes de usarse en NextResponse.redirect(). Por ejemplo, puedes usar la propiedad request.nextUrl para obtener la URL actual y modificarla para redirigir a otra URL.

import { NextResponse } from 'next/server'

// Dada una solicitud entrante...
const loginUrl = new URL('/login', request.url)
// Añade ?from=/incoming-url a la URL /login
loginUrl.searchParams.set('from', request.nextUrl.pathname)
// Y redirige a la nueva URL
return NextResponse.redirect(loginUrl)

`rewrite()`

Genera una respuesta que reescribe (proxies) la URL especificada manteniendo la URL original.

import { NextResponse } from 'next/server'

// Solicitud entrante: /about, el navegador muestra /about
// Solicitud reescrita: /proxy, el navegador muestra /about
return NextResponse.rewrite(new URL('/proxy', request.url))

`next()`

El método next() es útil para Middleware, ya que permite retornar temprano y continuar el enrutamiento.

import { NextResponse } from 'next/server'

return NextResponse.next()

También puedes reenviar headers al generar la respuesta:

import { NextResponse } from 'next/server'

// Dada una solicitud entrante...
const newHeaders = new Headers(request.headers)
// Añade un nuevo encabezado
newHeaders.set('x-version', '123')
// Y genera una respuesta con los nuevos encabezados
return NextResponse.next({
  request: {
    // Nuevos encabezados de solicitud
    headers: newHeaders,
  },
})

On this page