在前端开发过程中，经常会需要使用到 Cookies 进行信息的存储。而 npm 包 browser-cookies 则是一个专门针对浏览器的 Cookies 读写库，非常方便并易于使用。在本文中，我们将详细介绍如何使用 browser-cookies 包进行 Cookies 的读写。
安装
使用 npm 进行安装，可以在项目文件夹内使用以下命令：
npm install browser-cookies
设置/读取 Cookies
我们可以通过 set 方法进行 Cookies 的写入，格式如下：
const Cookies = require('browser-cookies');
Cookies.set('myCookie', 'myValue');其中，第一个参数为 Cookie 名，第二个参数则是 Cookie 的值。还可以指定第三个参数，用于控制 Cookie 的具体设置，例如过期时间、作用域等等。
Cookies 的读取则需要使用 get 方法：
const myCookieValue = Cookies.get('myCookie');若要删除 Cookies，可以使用 erase 方法：
Cookies.erase('myCookie');设置 Cookies 的过期时间
可以在 set 方法中使用 expires 参数来设置过期时间。例如：
Cookies.set('myCookie', 'myValue', { expires: 7 });这里设置了过期时间为7天。当然，也可以设置为带有时间信息的 Date 物件：
const myDate = new Date();
myDate.setTime(myDate.getTime() + (7 * 24 * 60 * 60 * 1000));
Cookies.set('myCookie', 'myValue', { expires: myDate });作用域的控制
Cookie 的作用域默认为当前访问 URL 的域名及其子域名。例如，如果设置了一个 Cookie 在 www.example.com 下，则它也会在 blog.example.com 中生效。这是因为 domain 参数默认为当前访问域名。但是，我们也可以通过指定 domain 参数来控制 Cookie 的作用域：
Cookies.set('myCookie', 'myValue', { domain: 'example.com' });这里我们指定了 Cookie 的作用域为 example.com。这样，该 Cookie 就会在所有子域名下生效了。
安全性
Cookie 的安全性是一个非常重要的问题。在 HTTP 头信息中，可以通过设置 Secure 和 HttpOnly 选项来加强 Cookie 的安全性。
Secure选项：设置为 true 时，该 Cookie 只能在 HTTPS 连接上被发送。这能够阻止无法安全传输敏感信息的 HTTP 连接访问该 Cookie。可以这样使用：Cookies.set('myCookie', 'myValue', { secure: true });HttpOnly选项：设置为 true 时，该 Cookie 无法通过 JavaScript 访问。这样能防止浏览器的 XSS 攻击。例如：Cookies.set('myCookie', 'myValue', { httpOnly: true });
示例代码
以下为一个完整的示例，以增删改查四个操作为例：
-- -------------------- ---- ------- ----- ------- - --------------------------- -- -- ------ ------------------- ----- ----- - -------- -- --------- ---- --- -- -- ------ ----- ---- - -------------------- ------------------- ---------- -- -- ------ ---------------------- -- ---- ------ ------------- ----- ----- ----- ---- --- ------ ---------------------- --- -- ---- ------ ----- ------ - -------------- -------------------- -- ---- ------ --------------- ----- --- ---- --- ------ -- ---
结束语
通过上面的介绍，我们可以看到 browser-cookies 包非常便捷易用，且提供了大量选项以满足不同情况下的读写需求。使用该库能够极大地提升 Cookies 的使用效率和安全性。
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/79361