jlnstack

Next.js

Cookie management for Next.js

Next.js

The Next.js adapter uses the cookies() function from next/headers under the hood.

import { createCookie } from "@jlnstack/cookies/next"

Server Components

import { createCookie } from "@jlnstack/cookies/next"

const theme = createCookie<"light" | "dark">("theme")

export default async function Page() {
  const currentTheme = await theme.get()
  
  return <div>Theme: {currentTheme ?? "system"}</div>
}

Server Actions

"use server"

import { createCookie } from "@jlnstack/cookies/next"

const theme = createCookie<"light" | "dark">("theme")

export async function setTheme(value: "light" | "dark") {
  await theme.set(value, {
    maxAge: 60 * 60 * 24 * 365,
    path: "/"
  })
}

Route Handlers

import { createCookie } from "@jlnstack/cookies/next"

const session = createCookie<string>("session")

export async function GET() {
  const token = await session.get()
  
  if (!token) {
    return Response.json({ error: "Unauthorized" }, { status: 401 })
  }
  
  return Response.json({ session: token })
}

Middleware

import { createCookie } from "@jlnstack/cookies/next"
import { NextResponse } from "next/server"

const locale = createCookie<string>("locale")

export async function middleware() {
  const currentLocale = await locale.get()
  
  if (!currentLocale) {
    const response = NextResponse.next()
    await locale.set("en", { path: "/" })
    return response
  }
}

On this page