在前端开发中，很多时候需要对客户端的 Cookie 进行操作，例如设置、获取、清除等操作。这时候我们可以使用一个很方便的 npm 包 ngx-cookie。
ngx-cookie 是什么
ngx-cookie 是一个 AngularJS 模块，用于简化 Cookie 操作，支持 Angular 2+。
它提供了一个依赖注入的 CookieService 服务，可以方便地使用各种 Cookie 操作方法，例如 set、get、remove 等。
安装 ngx-cookie
如果你使用的是 Angular CLI，那么可以通过如下命令进行安装：
npm install ngx-cookie --save
如果你使用的是其他打包工具，也可以使用类似的命令进行安装。
使用 ngx-cookie
引入 CookieModule
在 app.module.ts 中引入 CookieModule：
-- -------------------- ---- ------- ------ - ------------- - ---- ---------------------------- ------ - -------- - ---- ---------------- ------ - ------------ - ---- ------------- ------ - ------------ - ---- ------------------ ----------- ------------- - ------------ -- -------- - -------------- ---------------------- -- ---------- --- ---------- -------------- -- ------ ----- --------- - -展开代码
注意 CookieModule.forRoot() 方法需要放在 imports 数组中。
在组件中使用 CookieService
在需要使用 CookieService 的组件中引入 CookieService：
-- -------------------- ---- ------- ------ - --------- - ---- ---------------- ------ - ------------- - ---- ------------- ------------ --------- ----------- ------------ ----------------------- ---------- ----------------------- -- ------ ----- ------------ - ------------------- -------------- -------------- - - -展开代码
使用 CookieService
设置 Cookie
this.cookieService.put('name', 'value');
获取 Cookie
const value = this.cookieService.get('name'); console.log(value); // 输出 'value'
删除 Cookie
this.cookieService.remove('name');
设置 Cookie 选项
如果你需要设置 Cookie 的选项，例如过期时间、路径、域名等，可以通过传递一个 CookieOptions 对象来设置。
const cookieOptions = { expires: new Date('2022-12-31') }; this.cookieService.put('name', 'value', cookieOptions);
示例代码
-- -------------------- ---- ------- ------ - --------- - ---- ---------------- ------ - ------------- - ---- ------------- ------------ --------- ----------- --------- - ----- ------- ------- --------------------------- --------------- ----- ------- -- ----------- ------ ----- ------- ------- ------------------------------ --------------- -- -- ------ ----- ------------ - ------- ------------ ------- ------------------- -------------- -------------- - - ------------ ---- - ----- ------------- - - -------- --- ------------------ -- ------------------------------ -------- --------------- - --------------- ---- - ---------------------------------- - ------------ ---- - ---------------- - ------------------------------- - -展开代码
总结
ngx-cookie 是一个非常方便的 Cookie 操作 npm 包，可以帮助开发者简化 Cookie 操作。本文介绍了如何安装 ngx-cookie，引入 CookieModule，使用 CookieService 进行 Cookie 操作等，希望对你有所帮助。
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/5eedace0b5cbfe1ea0610b71
