js实现cookie

设置Cookie

使用document.cookie属性设置Cookie，格式为key=value。可以附加可选参数如过期时间、路径、域名等。

document.cookie = "username=John Doe; expires=Thu, 18 Dec 2025 12:00:00 UTC; path=/";

读取Cookie

通过document.cookie获取所有Cookie字符串，需手动解析目标值。

const cookies = document.cookie.split(';');
cookies.forEach(cookie => {
  const [key, value] = cookie.trim().split('=');
  if (key === 'username') console.log(value);
});

删除Cookie

将Cookie的过期时间设置为过去的时间，浏览器会自动删除。

document.cookie = "username=; expires=Thu, 01 Jan 1970 00:00:00 UTC; path=/;";

封装工具函数

const CookieUtil = {
  set(name, value, days) {
    const date = new Date();
    date.setTime(date.getTime() + days * 24 * 60 * 60 * 1000);
    document.cookie = `${name}=${value};expires=${date.toUTCString()};path=/`;
  },
  get(name) {
    const cookies = document.cookie.split(';');
    for (let cookie of cookies) {
      const [key, val] = cookie.trim().split('=');
      if (key === name) return decodeURIComponent(val);
    }
    return null;
  },
  remove(name) {
    this.set(name, '', -1);
  }
};

注意事项

• Cookie大小限制约4KB，每个域名下的Cookie数量有限制（通常20-50个）。
• 敏感信息不应存储在Cookie中，需考虑使用HttpOnly和Secure标志增强安全性。
• 现代应用推荐使用Web Storage API（localStorage/sessionStorage）替代简单数据存储。