js-cookie cookie的set 原理

### js-cookie 设置 Cookie 的实现与工作原理 js-cookie 是一个用于处理浏览器 Cookies 的轻量级 JavaScript 库。通过该库可以方便地设置、读取以及删除 cookies。 #### 设置 Cookie 的方法签名要使用 js-cookie 来设置 cookie，通常会调用 `Cookies.set` 方法： ```javascript Cookies.set('name', 'value', { expires: 7, path: '' }); ``` 此函数接受三个参数： - **键名** (`string`)：表示存储的数据名称。 - **值** (`any`)：希望保存的内容，会被自动转换成字符串形式。 - **选项对象** (`object`, 可选)：配置项，比如过期时间、路径等属性[^1]。 #### 主要功能特性 - **自定义有效期** 使用者可以通过传递带有 `expires` 属性的对象来指定 cookie 的有效期限。如果未提供，则默认为会话期间有效（即关闭浏览器标签页后失效）。当设置了具体的天数时，它会在给定数量的日历日后到期；也可以传入 Date 对象以精确控制日期和时间。 - **路径范围设定** 路径决定了哪些页面能够访问这个特定的 cookie。如果不特别指明，默认情况下只有创建它的 URL 所属目录下的资源能获取到这条记录。而通过显式声明 `/` 或其他路径模式，可以让更广泛甚至整个域名内的网页共享同一个 cookie 实例。 - **域作用域管理** 域字段允许跨子域共享 cookie 数据。这使得不同主机上的应用程序之间更容易交换信息而不必担心同源策略带来的限制。 - **安全标志位支持** Secure 和 HttpOnly 参数增强了安全性。前者确保 cookie 只能在 HTTPS 连接下传输，后者阻止客户端脚本读写操作从而防止 XSS 攻击风险。 - **编码解码机制** Js-cookie 自动处理特殊字符转义问题，在存入之前会对原始数据做适当编码，并在取出之后负责还原其本来面目以便于后续解析利用。 ```javascript // 示例代码展示如何使用上述提到的功能 const oneDay = 24 * 60 * 60 * 1000; // One day in milliseconds let tomorrow = new Date(Date.now() + oneDay); Cookies.set('username', 'John Doe', { expires: tomorrow, path: '/', domain: '.example.com', secure: true, httpOnly: false }); ```

阅读全文