js 如何设置和获取cookie,封装一个setCookie和getCookie的工具函数

JavaScript中可以封装一个setCookie工具函数用于方便地设置Cookie。下面是一个基础版本的setCookie函数示例：

// 封装setCookie函数
function setCookie(name, value, expiresDays = null, path = '/', domain = '', secure = false) {
  let cookieString = `${name}=${encodeURIComponent(value)}`;

  if (expiresDays) {
    const date = new Date();
    date.setTime(date.getTime() + (expiresDays * 24 * 60 * 60 * 1000)); // 计算过期时间（以天数为单位）
    cookieString += `; expires=${date.toUTCString()}`;
  }

  cookieString += `; path=${path}`;

  if (domain) {
    cookieString += `; domain=${domain}`;
  }

  if (secure) {
    cookieString += '; Secure'; // 如果是https网站，可以添加Secure属性以使cookie只能通过安全连接传输
  }

  document.cookie = cookieString;
}

// 使用示例：
setCookie('username', 'John Doe', 30); // 设置一个有效期为30天的cookie

上述函数接受五个参数：

1. name - Cookie的名称或键。
2. value - Cookie的值，通常会被encodeURIComponent编码以确保它可以包含特殊字符。
3. expiresDays - 可选参数，指定Cookie过期前的天数，默认为空则表示会话级Cookie（关闭浏览器时失效）。
4. path - Cookie的有效路径，默认为’/'，即整个域名下的所有路径都有效。
5. domain - Cookie所在的域，默认为空，表示当前域。
6. secure - 布尔值，表示是否仅通过HTTPS协议传输此Cookie。

请注意，实际使用时可能还需要根据需求进一步完善这个函数，比如支持更复杂的Expires时间格式，以及其他如HTTPOnly属性等。

在JavaScript中，获取cookie的基本方法是通过document.cookie属性。这是一个字符串，包含了浏览器当前域的所有cookie。为了从这个字符串中提取特定的cookie值，你可以编写一个函数来处理。这里是一个简单的示例：

// 封装getCookie函数
function getCookie(name) {
  const cookies = document.cookie.split(';');

  for (let i = 0; i < cookies.length; i++) {
    const cookie = cookies[i].trim();
    // 查找name=部分
    if (cookie.indexOf(`${name}=`) === 0) {
      // 获取等号后面的部分
      return decodeURIComponent(cookie.substring(name.length + 1));
    }
  }

  // 如果没有找到对应名称的cookie，则返回null或其他默认值
  return null;
}

// 使用示例：
const username = getCookie('username');
console.log(username);

上面的getCookie函数将遍历所有cookie，并查找名称匹配给定name参数的cookie。一旦找到匹配项，它将解码并返回该cookie的值。如果没有找到匹配的cookie，则返回null。

另外，如果你正在使用jQuery或者其他的库，它们可能会提供更便捷的方式来操作cookie，例如jQuery.cookie插件：

// 使用jQuery.cookie插件
if ($.cookie) { // 检查插件是否存在
  var username = $.cookie('username');
  console.log(username);
}

不过，请注意jQuery.cookie插件在较新的项目中可能不再被推荐使用，因为原生JavaScript提供的API已经足够满足大部分场景的需求。