文档:https://www.npmjs.com/package/js-cookie
npm
npm install js-cookie --save
CDN
<script src="https://cdn.jsdelivr.net/npm/js-cookie@2/src/js.cookie.min.js"></script>
示例
Cookies.set('name', 'value');
Cookies.get('name'); // => 'value'
Cookies.remove('name');
// JSON
Cookies.set('name', { foo: 'bar' });
Cookies.get('name'); // => '{"foo":"bar"}'
Cookies.getJSON('name'); // => { foo: 'bar' }
注意,如果set
指定了额外参数path 和 domain ,那么get
和remove
有需要指定
测试示例
浏览器控制台进行测试
引入js库文件
$i("https://cdn.jsdelivr.net/npm/js-cookie@2/src/js.cookie.min.js")
分别对3个情况进行写入、读取、删除
1. 默认 domain=null
2. 当前子域名 domain: "www.demo.com"
3. 顶级域名 domain: ".demo.com"
测试代码
Cookies.get()
{}
// 设置cookie ,domain最前面的点可以不写
Cookies.set("name", "default")
"name=default; path=/"
Cookies.set("name", "domain", {path:"/", domain: ".demo.com"})
"name=domain; path=/; domain=.demo.com"
Cookies.set("name", "domain-www", {path:"/", domain: "www.demo.com"})
"name=domain-www; path=/; domain=www.demo.com"
// 读取 谁最后设置,读取出来的就是谁
Cookies.get()
{name: "domain-www"}
// 移除
Cookies.remove("name")
undefined
Cookies.remove("name", {path:"/", domain: "www.demo.com"})
undefined
Cookies.remove("name", {path:"/", domain: "demo.com"})
undefined
因为Cookies是基于document.cookie的
document.cookie只有两个操作
// 写(设置和删除):
document.cookie = value
// 读(只能读取key=value,没有属性):
value = document.cookie