JavaScript – Cookie 使用

基本概念

Cookie 是浏览器用于暂时存储数据，Cookie 里的数据存放在电脑中的浏览器里，以各个站点为单位。不同的浏览器之间 Cookie 不共用，要在服务器环境下才能设置 Cookie。

基本使用

创建 Cookie

一次只可设置一个 Cookie 值

document.cookie = 'name=PUJI';

设置有效期

Expires 设置有效期，值是一个日期对象 (国际标准时间) 字符串。

const date = new Date().getTime(); // 转换为毫秒数
const newDate = new Date(date + 30*24*60*60*1000); // 加上有效期时间
document.cookie = 'name=PUJI; expires='newDate.toUTCString(); // 转换为国际标准时间

获取 Cookie

const cookie = document.cookie;
const x = 'name';
const reg = new RegExp('(^|\\s)' + x + '=[^;]+)(;|$)' );
console.log( cookie.match(reg)[2] );

封装

// 设置
function setCookie(json, time) {
  var date = newDate( new Date().getTime() + time*24*60*60*1000)
  for (var key in json) {
    document.cookie = key + '=' + json[key] + '; expires=' + date;
  }
}

// 获取
function getCookie(attr) {
  return document.cookie.match( new RegExp('(^|\\s)' + attr + '=[^;]+)(;|$)' ) );
}

// 清除
function removeCookie(attr) {
  var json = {};
  json[attr] = '';
  setCookie(json,-1);
}

setCookie({
  name: 'PUJI',
  age: 36
} , 30)

参考链接：

Bilibili 视频教程
https://www.bilibili.com/video/BV1k4411M7F