1.安装
npm install js-cookie --save
2.引入
①、全局引入
// main.js
import jsCookie from 'js-cookie'
Vue.prototype.$cookie = jsCookie; // 在页面里可直接用 this.$cookie 调用
②、按需引入
import Cookies from 'js-cookie'
Cookies.set('foo', 'bar')
3.使用
//写入Cookie
Cookies.set('name', 'value')
Cookies.set('name', 'value', { expires: 7 })
Cookies.set('name', 'value', { expires: 7, path: '' })
//读取Cookie
Cookies.get('name') // => 'value'
Cookies.get('nothing') // => undefined
Cookies.get() // => { name: 'value' }
Cookies.get('foo', { domain: 'sub.example.com' }) // `domain` won't have any effect...!
//删除Cookie
Cookies.remove('name')
Cookies.set('name', 'value', { path: '' })
Cookies.remove('name') // fail!
Cookies.remove('name', { path: '' }) // removed!
Cookies.remove('name', { path: '', domain: '.yourdomain.com' })
4.Cookie的属性
①过期时间 expires
定义什么时候删除cookie中的数据,值必须为number .
默认: 当用户关闭浏览器时,删除Cookie
Cookies.set('name', 'value', { expires: 365 })
Cookies.get('name') // => 'value'
Cookies.remove('name')
②path-路径
默认: /
Cookies.set('name', 'value', { path: '' })
Cookies.get('name') // => 'value'
Cookies.remove('name', { path: '' })
③domain
一个字符串,指示一个有效的域,其中cookie应该是可见的。cookie对所有子域也是可见的。
默认: Cookie只对创建Cookie的页面的域或子域可见,Internet Explorer除外(见下文)。
假设一个正在site.com上创建的cookie:
Cookies.set('name', 'value', { domain: 'subdomain.site.comCookies.set('name', 'value', { domain: 'subdomain.site.com' })
Cookies.get('name') // => undefined (need to read at ' subdomain.site.com')
④secure
true或false,表示cookie传输是否需要安全协议(https)。
默认: 没有安全协议
Cookies.set('name', 'value', { secure: true })
Cookies.get('name') // => 'value'
Cookies.remove('name')
⑤sameSite
一个字符串,允许控制浏览器是否在跨站点请求时发送cookie。
Cookies.set('name', 'value', { sameSite: 'strict' })
Cookies.get('name') // => 'value'
Cookies.remove('name')