js-cookie中，cookie.set使用详解

  js-cookie 是一个轻量级的 JavaScript 库，用于在浏览器中处理 Cookie。 它提供了简单易用的 API，使得设置、读取和删除 Cookie 变得更加方便。 其中，cookies.set 方法用于设置 Cookie，以下是详细介绍：

---

语法

cookie.set(name, value [, options])

或通过对象形式批量设置（需版本 >= 3.0.0）：

cookie.set({ 
  name1: 'value1', 
  name2: 'value2' 
}, options)

---

参数说明

1. name

   • 类型：String

   • 作用：Cookie 的名称。

2. value

   • 类型：String

   • 作用：Cookie 的值。

3. options（可选）

   • 类型：Object

   • 作用：配置 Cookie 的行为，包含以下属性：

---

选项（options）属性

属性	类型	说明
expires	Number 或 Date	过期时间：天数（如 7）或 Date 对象。默认会话结束后失效。
path	String	Cookie 的路径，默认为当前路径（/）。
domain	String	Cookie 的域名，默认为当前域名。
secure	Boolean	若为 true，仅通过 HTTPS 传输。默认为 false。
sameSite	String	控制跨站请求发送，可选 Strict、Lax、None（需 secure: true）。
encode	Function 或 false	对值的编码函数，默认 encodeURIComponent。设为 false 禁用编码。

---

示例代码

1. 基础用法

// 设置会话 Cookie
cookie.set("username", "dushky");

// 批量设置（多个 Cookie）
cookie.set({ 
  token: "abc123", 
  theme: "light" 
});

2. 设置过期时间

// 7 天后过期
cookie.set("user", "jack", { expires: 7 });

// 使用 Date 对象
const expiryDate = new Date(2025, 10, 10);
cookie.set("session", "id123", { expires: expiryDate });

3. 路径与域名

// 设置路径和域名
cookie.set("prefs", "dark", { 
  path: "/settings", 
  domain: "jutou.cc" 
});

4. 安全与 SameSite

// 仅 HTTPS，SameSite=None
cookie.set("secureID", "xyz", { 
  secure: true, 
  sameSite: "None" 
});

5. 禁用编码

// 值不进行 URI 编码
cookie.set("raw", "a;b,c", { encode: false });

---

注意事项：

• expires 属性用于设置 Cookie 的过期时间。

  • 如果设置为整数，表示从当前时间起的天数。
  • 如果设置为 Date 对象，表示具体的过期时间。
  • 如果不设置，Cookie 将是会话 Cookie，浏览器关闭时会被删除。

• path 和 domain 属性用于指定 Cookie 的有效范围。

  • path：指定 Cookie 的有效路径，默认为当前路径。
  • domain：指定 Cookie 的有效域名，默认为当前域名。

• secure 属性用于指定 Cookie 是否仅在 HTTPS 协议下传输。

  • 如果设置为 true，则只有在 HTTPS 协议下，浏览器才会发送该 Cookie。

• sameSite 属性用于指定 Cookie 的 SameSite 策略，增强安全性。

  • 'Strict'：仅在同站请求中发送 Cookie。
  • 'Lax'：在同站请求和部分跨站请求中发送 Cookie。
  • 'None'：在所有请求中发送 Cookie，但需要同时设置 secure 为 true。

• httpOnly 属性用于指定 Cookie 是否为 HttpOnly，防止 JavaScript 访问。

  • 如果设置为 true，则 JavaScript 无法通过 document.cookie 访问该 Cookie。
• sameSite 在旧版本浏览器中可能不被支持。

---

    通过灵活使用 cookie.set() 的选项，可以精确控制 Cookie 的作用范围和生命周期，适配不同场景需求。