前端 js 项目中怎么样操作 cookie？

2023-04-14 23:25| 来源: 网络整理| 查看: 265

一.在前端 JavaScript 中，我们可以使用 document.cookie 属性来操作 cookie

创建 cookie：document.cookie = "name=value";

2. 读取 cookie：

var x = document.cookie; var y = x.split(";"); for (var i = 0; i < y.length; i++) { if (y[i].indexOf("name=") == 0) { console.log(y[i].substring(5, y[i].length)); break; } }

3. 删除 cookie：

document.cookie = "name=" + "; expires=Thu, 01 Jan 1970 00:00:00 UTC; path=/;";

4.设置 cookie 过期时间：

var d = new Date(); d.setTime(d.getTime() + (30 * 24 * 60 * 60 * 1000)); var expires = "expires=" + d.toUTCString(); document.cookie = "name=value; " + expires + "; path=/;";

二.还可以使用第三方库

1.js-cookie

js-cookie 是一个小巧的 JavaScript 库，可以轻松地设置、获取和删除 cookie。它提供了简洁的 API，支持链式调用操作：

// 创建 cookie Cookies.set('name', 'value'); // 读取 cookie Cookies.get('name'); // 删除 cookie Cookies.remove('name');

2. jquery.cookie

jquery.cookie 是一个 jQuery 插件，也可以方便地操作 cookie。使用 jquery.cookie 可以在 jquery 中使用简单的方法来处理 cookie：

// 创建 cookie $.cookie('name', 'value'); // 读取 cookie $.cookie('name'); // 删除 cookie $.removeCookie('name');

3. universal-cookie

universal-cookie 是一个能够用于各种 JavaScript 环境的通用 cookie 库，它可以在浏览器、服务器和 React Native 中使用同一套 API 操作 cookie。它也提供了简单的方法来创建、获取、删除和更新 cookie：

// 创建 cookie const cookies = new Cookies(); cookies.set('name', 'value'); // 读取 cookie cookies.get('name'); // 删除 cookie cookies.remove('name');

【本文地址】

公司简介

联系我们