Get the User's Cookies from both the server and the client with one function

I don't know why this is not built into sveltekit.

Setup

hooks.server.ts:

import { fullstackCookiesHandle } from "sveltekit-fullstack-cookies"

export const handle = sequence(fullstackCookiesHandle /* ... */)

Use

The getCookies() method returns an object containing the cookies (keys-value pairs).

1. Make all cookies available globally with $page.data.cookies (reactive):

root +layout.ts:

import { getCookies } from "sveltekit-fullstack-cookies"

export const load = async () => {
	/* ... */
	return {
		cookies: await getCookies(),
		/* ... */
	}
}

To reload the cookies, call invalidateAll() (imported from @app/navigation)

2. Get the current cookies at one specific moment:

import { getCookies } from "sveltekit-fullstack-cookies"

const cookies = await getCookies()

Additionally, you can provide a fallback for prerendering:

await getCookies({ exampleCookie: "example value" })