Cookies     

This is a wrapper over the standardized document.cookie.

NOTE
In addition, you can read and write cookies using JSON objects.

Installation

Edit /quasar.conf.js:

framework: {
  plugins: ['Cookies']
}

// outside of a Vue file
import { Cookies } from 'quasar'

var value = Cookies.get('cookie_name')

When cookie is not set, the return value is undefined.

// inside of a Vue file
this.$q.cookies.get('cookie_name')

Read All Cookies

// outside of a Vue file
import { Cookies } from 'quasar'

var cookies = Cookies.all()

cookies variable will be an object with key-value pairs (cookie_name : cookie_value).

// inside of a Vue file
this.$q.cookies.all()
// outside of a Vue file
import { Cookies } from 'quasar'

(Boolean) Cookies.has('cookie_name')
// inside of a Vue file
this.$q.cookies.has('cookie_name')
// outside of a Vue file
import { Cookies } from 'quasar'

Cookies.set('cookie_name', cookie_value, options)

options is an Object which can have the following properties: expire, path, domain, secure. They are explained below.

// outside of a Vue file
import { Cookies } from 'quasar'

Cookies.set('quasar', 'framework', {
  secure: true
})
// inside of a Vue file
this.$q.cookies.set('cookie_name', cookie_value, options)

Option expires

expires: 10

Define lifetime of the cookie. Value can be a Number which will be interpreted as days from time of creation or a Date object. If omitted, the cookie becomes a session cookie.

Option path

path: '/'

Define the path where the cookie is valid. By default the path of the cookie is the path of the page where the cookie was created (standard browser behavior). If you want to make it available for instance across the entire domain use path: ‘/‘. Default: path of page where the cookie was created.

Option domain

domain: 'quasar-framework.org'

Define the domain where the cookie is valid. Default: domain of page where the cookie was created.

Option secure

secure: true

If true, the cookie transmission requires a secure protocol (HTTPS) and will NOT be sent over HTTP. Default value is false.

// outside of a Vue file
import { Cookies } from 'quasar'

Cookies.remove('cookie_name')
// inside of a Vue file
this.$q.cookies.remove('cookie_name')
Other Utils Web Storage
Last updated: Sat May 19 2018
Caught a mistake or want to contribute to the documentation? Suggest an edit on GitHub