Next.js - cookies() Function

---

---

The cookies() Function

The Next.js cookies() function used to read the incoming HTTP requests cookies in server components. This function returns a CookieStore object that provides methods to access the cookies sent by the client in the request headers.

Syntax

Following is the syntax of cookies() function:

import { cookies } from 'next/headers'
 
export default async function Page() {
    const cookieStore = await cookies()
    const theme = cookieStore.get('theme')
    return '...'
}

Parameters

The cookies() function does not take any parameters.

Return Value

The cookies() function returns a Promise that resolves to a CookieStore object. The CookieStore object provides methods to access the cookies sent by the client in the request headers.

Cookie Store Methods

The CookieStore object provides the following methods to access the cookies:

Example 1

You can use the (await cookies()).get('name') method to get a single cookie. The following example demonstrates how to access a single cookie named 'theme'.

import { cookies } from 'next/headers'
 
export default async function Page() {
  const cookieStore = await cookies()
  const theme = cookieStore.get('theme')
  return '...'
}

Example 2

You can use the (await cookies()).getAll() method to get all cookies with a matching name. If name is unspecified, it returns all the available cookies. The following example demonstrates how to access all cookies sent by the client in the request headers.

import { cookies } from 'next/headers'
 
export default async function Page() {
  const cookieStore = await cookies()
  return cookieStore.getAll().map((cookie) => (
    <div key={cookie.name}>
        <p>Name: {cookie.name}</p>
        <p>Value: {cookie.value}</p>
    </div>
  ))
}

Example 3

You can use the (await cookies()).set(name, value, options) method in a Server Action or Route Handler to set a cookie. The following example demonstrates how to set a cookie named 'theme' with the value 'dark'.

import { cookies } from 'next/headers'

export default async function Page() {
  const cookieStore = await cookies()
  cookieStore.set('theme', 'dark', { path: '/' })
  return '...'
}