Search code examples
sveltesveltekit

How to access cookies within +layout.js in SvelteKit?


I want to access cookies in the load function within +layout.js. I want to be able to make my header/nav in the template show "login/signup" in the nav if there is not a jwt saved in cookies, but show "logout" if there is.

Below is my +layout.js. I expect this to access cookies like it does in the exact same code in my +page.server.js file. Instead, I get the error "Cannot read properties of undefined (reading 'get')"

export function load({ cookies }) {
    return {
        jwt: cookies.get("jwt")
    }
}

Solution

  • Cookies are only available in the server events.
    I.e. +page.server.js/.ts or +layout.server.js/.ts.

    Universal load functions (without .server) also run on the client, which may or may not be able to access the cookies (it should not because generally cookies should be HttpOnly).