cookies

La función cookies permite leer las cookies de solicitud HTTP entrantes desde un Componente de Servidor (Server Component) o escribir cookies de solicitud salientes en una Acción de Servidor (Server Action) o Manejador de Ruta (Route Handler).

Es bueno saberlo: cookies() es una Función Dinámica (Dynamic Function) cuyos valores devueltos no pueden conocerse de antemano. Usarla en un layout o página optará a la ruta por un renderizado dinámico (dynamic rendering) en el momento de la solicitud.

cookies().get(nombre)

Un método que toma un nombre de cookie y devuelve un objeto con nombre y valor. Si no se encuentra una cookie con ese nombre, devuelve undefined. Si múltiples cookies coinciden, solo devolverá la primera coincidencia.

import { cookies } from 'next/headers'

export default function Page() {
  const cookieStore = cookies()
  const theme = cookieStore.get('theme')
  return '...'
}

cookies().getAll()

Un método similar a get, pero devuelve una lista de todas las cookies que coincidan con el nombre. Si no se especifica nombre, devuelve todas las cookies disponibles.

import { cookies } from 'next/headers'

export default function Page() {
  const cookieStore = cookies()
  return cookieStore.getAll().map((cookie) => (
    <div key={cookie.name}>
      <p>Nombre: {cookie.name}</p>
      <p>Valor: {cookie.value}</p>
    </div>
  ))
}

cookies().has(nombre)

Un método que toma un nombre de cookie y devuelve un boolean basado en si la cookie existe (true) o no (false).

import { cookies } from 'next/headers'

export default function Page() {
  const cookieStore = cookies()
  const hasCookie = cookieStore.has('theme')
  return '...'
}

cookies().set(nombre, valor, opciones)

Un método que toma un nombre de cookie, valor y opciones, y establece la cookie de solicitud saliente.

Es bueno saberlo: HTTP no permite establecer cookies después de que comience el streaming, por lo que debe usar .set() en una Acción de Servidor (Server Action) o Manejador de Ruta (Route Handler).

'use server'

import { cookies } from 'next/headers'

async function create(data) {
  cookies().set('name', 'lee')
  // o
  cookies().set('name', 'lee', { secure: true })
  // o
  cookies().set({
    name: 'name',
    value: 'lee',
    httpOnly: true,
    path: '/',
  })
}

Eliminar cookies

Es bueno saberlo: Solo puede eliminar cookies en una Acción de Servidor (Server Action) o Manejador de Ruta (Route Handler).

Hay varias opciones para eliminar una cookie:

cookies().delete(nombre)

Puede eliminar explícitamente una cookie con un nombre dado.

'use server'

import { cookies } from 'next/headers'

async function delete(data) {
  cookies().delete('name')
}

cookies().set(nombre, '')

Alternativamente, puede establecer una nueva cookie con el mismo nombre y un valor vacío.

'use server'

import { cookies } from 'next/headers'

async function delete(data) {
  cookies().set('name', '')
}

Es bueno saberlo: .set() solo está disponible en una Acción de Servidor (Server Action) o Manejador de Ruta (Route Handler).

cookies().set(nombre, valor, { maxAge: 0 })

Establecer maxAge en 0 hará que una cookie expire inmediatamente.

'use server'

import { cookies } from 'next/headers'

async function delete(data) {
  cookies().set('name', 'value', { maxAge: 0 })
}

cookies().set(nombre, valor, { expires: timestamp })

Establecer expires en cualquier valor en el pasado hará que una cookie expire inmediatamente.

'use server'

import { cookies } from 'next/headers'

async function delete(data) {
  const oneDay = 24 * 60 * 60 * 1000
  cookies().set('name', 'value', { expires: Date.now() - oneDay })
}

Es bueno saberlo: Solo puede eliminar cookies que pertenezcan al mismo dominio desde el que se llama a .set(). Además, el código debe ejecutarse en el mismo protocolo (HTTP o HTTPS) que la cookie que desea eliminar.

Historial de versiones