浏览器 Cookie 的使用

Cookie介绍

主要用于存储访问过的网站数据,把浏览器的信息存储到本地电脑中,实现客户端和服务器端的通讯。

Cookie特点

  • 以文本形式保存(.txt)
  • Cookie存储信息不安全(不能存放重要的信息)
  • Cookie中有域(domain)和路径的概念,浏览器是一个比较安全的环境,所以不同的域之间不能直接访问(js的同源策略限制)

Cookie的常用属性

1
2
3
4
5
6
7
8
Name:cookie的名字(键)
Value:cookie存放的值
Expires:指cookie过期的时间(该时间为世界时间 UTC时间)也称为格林威治时间
Max-Age: 指cookie最大的存活有效期(单位:秒)
Domain: 指的是cookie当前的域
Path:指cookie当前的路径
Size: 指cookie存放的大小
Secure: 指cooke的安全属性

JavaScript操作Cookie

  1. document.cookie 属性创建、读取、删除 cookie
1
2
document.cookie='name=Peak';
console.log(document.cookie);
  1. 设置cookie失效时间

设置一个10分钟后失效的Cookie

1
2
3
4
5
function setCookie(name, value, expire){
let expires = new Date(new Date().getTime() + loginRes.data.expire * 1000);
document.cookie = `${name}=${value};expires=${expires}`;
}
setCookie('name', 'Peak', 10);

注意:过期时间是格林威治时间(UTC时间)

  1. 提前清除cookie

把过期时间设置为小于当前时间即可

1
setCookie('name', 'Peak', -1);
坚持原创技术分享,您的支持将鼓励我继续创作!
0%