操作 cookie 的技巧

一、通过名称获取 cookie

浏览器没有提供 API 供我们获取 cookie，所以我们需要编写复杂的逻辑来解决这个问题。

例如:

假设以下 cookie 信息存储在 www.example.com 网站下。

// BD_UPN=123253;  ___rl__test__cookies=1691332234378; OUTFOX_SEARCH_USER_ID_NCOO=279255438.227351

我们可以使用 getCookieByName 方法获取这些值中的任何一个。

const getCookieByName = (name) => {
  const cookies = Object.fromEntries(
    document.cookie.split("; ").map((cookie) => cookie.split("="))
  );
  return decodeURIComponent(cookies[name] || "");
};

例子：

getCookieByName("OUTFOX_SEARCH_USER_ID_NCOO"); // 279255438.227351
getCookieByName("BD_UPN"); // 123253
getCookieByName("___rl__test__cookies"); // 1691332234378

二、删除 cookie

我们怎样才能删除 cookie 呢？答案是将过期时间设置为当前时刻之前一秒。

const deleteCookie = (name) => {
  const nowDate = new Date();
  nowDate.setTime(nowDate.getTime() - 1000);

  document.cookie = `${encodeURIComponent(
    name
  )}=;expires=${nowDate.toUTCString()};path=/`;
};

例子：

deleteCookie("___rl__test__cookies");
getCookieByName("___rl__test__cookies"); // ''

三、设置 cookie

除了获取 cookie 和删除 cookie 之外，我们还需要设置 cookie

const setCookie = (name, value, millisecondsToExpire, path = "/") => {
  const nowDate = new Date();
  nowDate.setTime(nowDate.getTime() + millisecondsToExpire);

  document.cookie = `${name}=${value}; expires=${nowDate.toUTCString()}; ${path}`;
};

例子：

setCookie("name", "fatfish", 3000); // After 3 seconds name will be removed from the c`