js-cookie
那该多好 Lv2
  2021-07-07 15:52:04 2021-07-07 15:52    

创建cookie

1
2
3
4
5
6
// 创建一个cookie，在这整个站点中有效
Cookies.set('name', 'value');
// 创建一个有效期为7天的cookie，在整个站点中有效
Cookies.set('name', 'value', { expires: 7 });
// 创建一个有效期为7天的cookie，只在当前页面生效
Cookies.set('name', 'value', { expires: 7, path: ''  })

读取cookie

1
2
3
4
Cookies.get("name") // => 'value'
Cookies.get("nothing") //=> 'undefined'
// 读取所有可见的cookies
Cookies.get() // => { name: 'value' }

删除cookie

1
2
3
4
5
6
7
Cookies.remove('name');
// 如果设置了路径，在删除时也需指定路径
// 例：
Cookies.set('name', 'value', { path:'' })
// 删除不存在的cookies不会报错也没有返回
Cookies.remove('name')  // 删除失败
Cookies.remove('name', { path:'' }) // 删除成功

命名空间

如果担心修改掉Cookies中的数据，可以使用noConflict方法定义一个新的空间，并保留原始cookies

1
2
3
// 将 js-cookie api 分配给不同的变量。恢复原来的'window.Cookies'
var Cookies2 = Cookies.noConflict()
Cookies2.set('name','value')

json相关

js-cookies允许向cookie中存储json信息
通过set方法传入Array或对象，而不是简单的string，那么js-cookies会自动调用JSON.stringify将传入的数据转为json

1
2
3
Cookies.set('name', { foo: 'bar' });
Cookies.get('name'); // => '{ "foo": "bar" }'
Cookies.get(); // => { name: '{ "foo": "bar" }' }

如果用getJSON方法获取Cookies，那么js-cookies会调用JSON.parse 解析 json 后返回。

1
2
Cookies.getJSON('name'); // => { foo:'bar' }
Cookies.getJSON();  // => { name:{ foo: 'bar' } }

set方法支持的属性

  1. expires
    定义有效期。如果传入Number,那么单位为天，也可以传入一个Date对象，表示有效期至Date指定时间。如果省略，cookie将成为会话cookie。默认 当用户关闭浏览器时Cookie被删除。
  2. path
    string, 表示cookie对哪个地址可见，默认为 /
  3. domain
    string, 表示此cookie对哪个域名可见。改cookie也将对所有子域可见。 默认Cookie仅对创建该cookie的页面的域或其子域可见。
  4. secure
    true | false, 表示cookie传输是否仅支持https，默认 无安全协议要求
 评论