Numerous Problems Multiplied
    Wondering what’s next for npm?Check out our public roadmap! »

    cookie-universal-nuxt
    TypeScript icon, indicating that this package has built-in type declarations

    2.1.5 • Public • Published

    cookie-universal-nuxt

    npm (scoped with tag) npm js-standard-style

    Universal cookie plugin for Nuxt, perfect for SSR

    You can use cookie-universal-nuxt to set, get and remove cookies in both client and server side nuxt apps. cookie-universal-nuxt parse cookies with the popular cookie node module.

    Install

    • yarn: yarn add cookie-universal-nuxt
    • npm: npm i --save cookie-universal-nuxt

    Add cookie-universal-nuxt to nuxt.config.js:

    {
      modules: [
        // Simple usage
        'cookie-universal-nuxt',
    
        // With options
        ['cookie-universal-nuxt', { alias: 'cookiz' }],
     ]
    }

    ParseJSON

    By default cookie-universal will try to parse to JSON, however you can disable this functionality in several ways:


    Disable globally

    • Disable from the plugin options:
    {
      modules: [
        ['cookie-universal-nuxt', { parseJSON: false }],
     ]
    }
    

    Disable globally on the fly

    // nuxt middleware
    export default ({ app }) => {
      app.$cookies.parseJSON = false
    }
    
    // client
    this.$cookies.parseJSON = false

    Disable on a specific get request

    // nuxt middleware
    export default ({ app }) => {
      app.$cookies.get('cookie-name', { parseJSON: false })
    }
    
    // client
    this.$cookies.get('cookie-name', { parseJSON: false })

    Api

    set(name, value, opts)

    • name (string): Cookie name to set.
    • value (string|object): Cookie value.
    • opts (object): Same as the cookie node module.
      • path (string): Specifies the value for the Path Set-Cookie attribute. By default, the path is considered the "default path".
      • expires (date): Specifies the Date object to be the value for the Expires Set-Cookie attribute.
      • maxAge (number): Specifies the number (in seconds) to be the value for the Max-Age Set-Cookie attribute.
      • httpOnly (boolean): Specifies the boolean value for the [HttpOnly Set-Cookie attribute][rfc-6265-5.2.6].
      • domain (string): specifies the value for the Domain Set-Cookie attribute.
      • encode (function): Specifies a function that will be used to encode a cookie's value.
      • sameSite (boolean|string): Specifies the value for the SameSite Set-Cookie attribute.
        Possible values: true, false, 'lax', 'none', 'strict' (see details). Default is false.
      • secure (boolean): Specifies the boolean value for the Secure Set-Cookie attribute.
    const cookieValObject = { param1: 'value1', param2: 'value2' }
    
    // nuxt middleware
    export default ({ app }) => {
      app.$cookies.set('cookie-name', 'cookie-value', {
        path: '/',
        maxAge: 60 * 60 * 24 * 7
      })
      app.$cookies.set('cookie-name', cookieValObject, {
        path: '/',
        maxAge: 60 * 60 * 24 * 7
      })
    }
    
    // client
    this.$cookies.set('cookie-name', 'cookie-value', {
      path: '/',
      maxAge: 60 * 60 * 24 * 7
    })
    this.$cookies.set('cookie-name', cookieValObject, {
      path: '/',
      maxAge: 60 * 60 * 24 * 7
    })

    setAll(cookieArray)

    • cookieArray (array)
      • name (string): Cookie name to set.
      • value (string|object): Cookie value.
      • opts (object): Same as the cookie node module
        • path (string): Specifies the value for the Path Set-Cookie attribute. By default, the path is considered the "default path".
        • expires (date): Specifies the Date object to be the value for the Expires Set-Cookie attribute.
        • maxAge (number): Specifies the number (in seconds) to be the value for the Max-Age Set-Cookie attribute.
        • httpOnly (boolean): Specifies the boolean value for the [HttpOnly Set-Cookie attribute][rfc-6265-5.2.6].
        • domain (string): specifies the value for the Domain Set-Cookie attribute.
        • encode (function): Specifies a function that will be used to encode a cookie's value.
        • sameSite (boolean|string): Specifies the value for the SameSite Set-Cookie attribute.
          Possible values: true, false, 'lax', 'none', 'strict' (see details). Default is false.
        • secure (boolean): Specifies the boolean value for the Secure Set-Cookie attribute.
    const options = {
      path: '/',
      maxAge: 60 * 60 * 24 * 7
    }
    const cookieList = [
      { name: 'cookie-name1', value: 'value1', opts: options },
      { name: 'cookie-name2', value: 'value2', opts: options },
      { name: 'cookie-name3', value: 'value3', opts: options },
      { name: 'cookie-name4', value: 'value4', opts: options }
    ]
    
    // nuxt middleware
    export default ({ app }) => {
      app.$cookies.setAll(cookieList)
    }
    
    // client
    this.$cookies.setAll(cookieList)

    get(name, opts)

    • name (string): Cookie name to get.
    • opts
      • fromRes (boolean): Get cookies from res instead of req.
      • parseJSON (boolean): Parse json, true by default unless overridden globally or locally.
    // nuxt middleware
    export default ({ app }) => {
      const cookieRes = app.$cookies.get('cookie-name')
      const cookieRes = app.$cookies.get('cookie-name', { fromRes: true }) // get from res instead of req
      // returns the cookie value or undefined
    }
    
    // client
    const cookieRes = this.$cookies.get('cookie-name')
    // returns the cookie value or undefined

    getAll(opts)

    • opts
      • fromRes (boolean): Get cookies from res instead of req.
      • parseJSON (boolean): Parse json, true by default unless overridden globally or locally.
    // nuxt middleware
    export default ({ app }) => {
      const cookiesRes = app.$cookies.getAll()
      const cookiesRes = app.$cookies.getAll({ fromRes: true }) // get from res instead of req
      // returns all cookies or {}
      //{
      //  "cookie-1": "value1",
      //  "cookie-2": "value2",
      //}
    }
    
    // client
    const cookiesRes = this.$cookies.getAll()
    // returns all cookies or {}
    //{
    //  "cookie-1": "value1",
    //  "cookie-2": "value2",
    //}

    remove(name, opts)

    • name (string): Cookie name to remove.
    • opts
      • path (string): Specifies the value for the Path Set-Cookie attribute. By default, the path is considered the "default path".
      • expires (date): Specifies the Date object to be the value for the Expires Set-Cookie attribute.
      • maxAge (number): Specifies the number (in seconds) to be the value for the Max-Age Set-Cookie attribute.
      • httpOnly (boolean): Specifies the boolean value for the [HttpOnly Set-Cookie attribute][rfc-6265-5.2.6].
      • domain (string): specifies the value for the Domain Set-Cookie attribute.
      • encode (function): Specifies a function that will be used to encode a cookie's value.
      • sameSite (boolean|string): Specifies the value for the SameSite Set-Cookie attribute.
        Possible values: true, false, 'lax', 'none', 'strict' (see details). Default is false.
      • secure (boolean): Specifies the boolean value for the Secure Set-Cookie attribute.
    // nuxt middleware
    export default ({ app }) => {
      app.$cookies.remove('cookie-name')
      app.$cookies.remove('cookie-name', {
        // this will allow you to remove a cookie
        // from a different path
        path: '/my-path'
      })
    }
    
    // client
    this.$cookies.remove('cookie-name')

    removeAll()

    // note that removeAll does not currently allow you
    // to remove cookies that have a
    // path different from '/'
    
    // nuxt middleware
    export default ({ app }) => {
      app.$cookies.removeAll()
    }
    
    // client
    this.$cookies.removeAll()

    nodeCookie

    This property will expose the cookie node module so you don't have to include it yourself.

    // nuxt middleware
    export default ({ app }) => {
      const cookieRes = app.$cookies.nodeCookie.parse('cookie-name', 'cookie-value')
      cookieRes['cookie-name'] // returns 'cookie-value'
    }
    
    // client
    const cookieRes = this.$cookies.nodeCookie.parse('cookie-name', 'cookie-value')
    cookieRes['cookie-name'] // returns 'cookie-value'

    Plugin options

    • alias (string): Specifies the plugin alias to use.
    • parseJSON (boolean): Disable JSON parsing.
    {
      modules: [
        ['cookie-universal-nuxt', { alias: 'cookiz', parseJSON: false }],
     ]
    }
    
    
    // usage
    this.$cookiz.set('cookie-name', 'cookie-value')

    License

    MIT License

    Copyright (c) Salvatore Tedde microcipcip@gmail.com

    Install

    npm i cookie-universal-nuxt

    DownloadsWeekly Downloads

    77,431

    Version

    2.1.5

    License

    MIT

    Unpacked Size

    13.4 kB

    Total Files

    7

    Last publish

    Collaborators

    • avatar