文章目录
特性介绍
js-cookie 是一个上手简单,轻量的,处理cookies的库
有如下特点:
- 在所有浏览器是可用
- 允许所有的字符集
- 支持 ES6 模块化, AMD 和 CommonJs 模块化
- 符合 RFC 6265
- 有wiki
- 允许自定义编码、解码
- 小体积,小于 800 bytes
一、安装
npm i js-cookie
二、使用步骤
1.引入库
import Cookies from "js-cookie"
2.基础用法(设置读取删除)
创建一个 cookie,在整个站点中有效:
Cookies.set('name', 'value')
创建一个cookie,有效期为7天,在整个站点上有效:
Cookies.set('name', 'value', {
expires: 7 })
js-cookie 的expires 属性是支持一个Data实例对象的。
假设cookie是要在15分钟之后过期
var inFifteenMinutes = new Date(new Date().getTime() + 15 * 60 * 1000);
Cookies.set('foo', 'bar', {
expires: inFifteenMinutes});
你也可以设置cookie的有效时间只有半天
var inHalfADay = 0.5;
Cookies.set('foo', 'bar', {
expires: inHalfADay});
或者是 半个小时(30分钟)
var in30Minutes = 1/48;
Cookies.set('foo', 'bar', {
expires: in30Minutes});
创建一个指定有效期的cookie,且对当前页面的路径有效:
Cookies.set('name', 'value', {
expires: 7, path: '' })
读取cookie:
Cookies.get('name') // => 'value'Cookies.get('nothing') // => undefined
读取所有cookie:
Cookies.get() // => {
name: 'value' }
注意;无法通过传递 cookie 属性之一(在设置相关 cookie 时可能已使用或未使用的述下)来读取特定 cookie
Cookies.get('foo', {
domain: 'sub.example.com' }) // `domain` won't have any effect...!
值为 foo 的 cookie 只能通过 .get() 来读取,前提是这个cookie是允许你的代码读取的,通过指定 域和/或路径属性 来读取cookie是不会生效的
删除cookie:
Cookies.remove('name')
删除一个对当前页面路径有效的cookie:
Cookies.set('name', 'value', {
path: '' })
Cookies.remove('name') // fail!, 需要指定 path字段,如下行代码
Cookies.remove('name', {
path: '' }) // removed!
重要! 当删除 cookie 并且这个cookie你有指定一些属性时,您必须传递用于设置 cookie 的完全相同的路径和域属性
Cookies.remove('name', {
path: '', domain: '.yourdomain.com' })