JSPM

  • Created
  • Published
  • Downloads 232003
  • Score
    100M100P100Q164193F
  • License MIT

A set of cookie helpers for Next.js

Package Exports

  • nookies

This package does not declare an exports field, so the exports above have been automatically detected and optimized by JSPM instead. If any package subpath is missing, it is recommended to post an issue to the original package (nookies) to support the "exports" field. If that is not possible, create a JSPM override to customize the exports field for this package.

Readme

nookies 🍪 🍪 🍪

CircleCI npm version

A collection of cookie helpers for Next.js

  • SSR support, for setter, parser and destroy
  • super light
  • perfect for authentication

Setting and destroying cookies also works on server-side.

Quick start

npm install --save nookies

SSR cookies

import { parseCookies, setCookie, destroyCookie } from 'nookies'

export default class Me extends React.Component {
  static async getInitialProps(ctx) {
    // Parse
    parseCookies(ctx)

    // Set
    setCookie(ctx, 'token', token, {
      maxAge: 30 * 24 * 60 * 60,
      path: '/',
    })

    // Destroy
    destroyCookie(ctx, 'token')
  }

  render() {
    return <div>My profile</div>
  }
}

OR

import nookies from 'nookies'

export default class Me extends React.Component {
  static async getInitialProps(ctx) {
    // Parse
    nookies.get(ctx)

    // Set
    nookies.set(ctx, 'token', token, {
      maxAge: 30 * 24 * 60 * 60,
      path: '/',
    })

    // Destroy
    nookies.destroy(ctx, 'token')
  }

  render() {
    return <div>My profile</div>
  }
}

Cookies on the client

import { parseCookies } from 'nookies'

export default class Me extends React.Component {
  handleClick = () => {
    // Simply omit context parameter.
    // Parse
    const cookies = parseCookies()
    console.log({ cookies })
    // Set
    setCookie(null, 'token', token, {
      maxAge: 30 * 24 * 60 * 60,
      path: '/',
    })
    // Destroy
    destroyCookie(null, 'token')
  }

  render() {
    return <button onClick={this.handleClick}>Click Me!</button>
  }
}

Reference

For client side usage, omit the ctx parameter. You can do so by setting it to an empty object ({}).

parseCookies(ctx, options) or cookies.get(ctx, options)

  • ctx: Next.js context
  • options:
    • decode: a custom resolver function (default: decodeURIComponent)

setCookie(ctx, name, value, options) or cookies.set(ctx, name, value, options)

  • ctx: (Next.js context)
  • name: cookie name
  • value: cookie value
  • options:
    • domain
    • encode
    • expires
    • httpOnly
    • maxAge
    • path
    • sameSite
    • secure

destroyCookie(ctx, name, options) or cookies.destroy(ctx, 'token', options)

  • ctx: (Next.js context)
  • name: cookie name
  • options:
    • domain
    • path

License

MIT