localStorage和sessionStorage与cookie

孩子你要相信光

已于 2024-06-03 14:28:08 修改

阅读量1k

点赞数 18

分类专栏： JavaScript 文章标签： javascript 前端

于 2024-06-03 14:27:31 首次发布

本文链接：https://blog.csdn.net/qq505751223/article/details/139413317

版权

JavaScript 专栏收录该内容

2 篇文章 0 订阅

订阅专栏

localStorage

使用（JavaScript）

设置数据：

localStorage.setItem('key', 'value');  
// 或者  
localStorage['key'] = 'value';

获取数据：

var data = localStorage.getItem('key');  
// 或者  
var data = localStorage['key'];

删除数据：
```
localStorage.removeItem('key');
```
清除所有数据：
```
localStorage.clear();
```

检查键是否存在：

if (localStorage.getItem('key')) {  
    // 键存在  
}

遍历所有数据：

for (var i = 0; i < localStorage.length; i++) {  
    var key = localStorage.key(i);  
    var value = localStorage.getItem(key);  
    console.log(key + ' => ' + value);  
}

sessionStorage

使用

设置数据：

sessionStorage.setItem('key', 'value');  
// 或者  
sessionStorage['key'] = 'value';

获取数据：

var data = sessionStorage.getItem('key');  
// 或者  
var data = sessionStorage['key'];

删除数据：
```
sessionStorage.removeItem('key');
```
清除所有数据：
```
sessionStorage.clear();
```

检查键是否存在：

if (sessionStorage.getItem('key')) {  
    // 键存在  
}

遍历所有数据：

for (var i = 0; i < sessionStorage.length; i++) {  
    var key = sessionStorage.key(i);  
    var value = sessionStorage.getItem(key);  
    console.log(key + ' => ' + value);  
}

cookie

属性

cookie 的属性通常通过键值对的形式在服务器端设置，并通过 HTTP 响应头发送到浏览器。以下是一些常见的 cookie 属性：

name: cookie 的名称。
value: cookie 的值。
expires: cookie 的过期日期和时间（UTC）。如果未设置，cookie 将在浏览器会话结束时过期。
max-age: cookie 的最大生存时间（以秒为单位），从 cookie 的创建或最后一次访问开始计算。
domain: 指定哪些主机可以接收 cookie。
path: 指定哪些路径可以接收 cookie。
secure: 如果设置为 true，则 cookie 只能通过 HTTPS 协议传输。
HttpOnly: 如果设置为 true，则 JavaScript 无法访问 cookie（防止 XSS 攻击）。

使用

服务器端设置 cookie（以 Node.js 和 Express 为例）：

res.cookie('key', 'value', {  
    expires: new Date(Date.now() + 900000), // 设置过期时间为当前时间后的 15 分钟  
    httpOnly: true // 限制 JavaScript 访问  
});

JavaScript 读取 cookie（注意：由于 HttpOnly 属性，JavaScript 可能无法读取某些 cookie）：
通常，JavaScript 需要通过解析 document.cookie 字符串来读取 cookie。由于 document.cookie 返回一个包含所有 cookie 的字符串（由分号和空格分隔），因此你需要解析它来获取特定的 cookie。

function getCookie(name) {  
    var nameEQ = name + "=";  
    var ca = document.cookie.split(';');  
    for(var i=0;i < ca.length;i++) {  
        var c = ca[i];  
        while (c.charAt(0)==' ') c = c.substring(1,c.length);  
        if (c.indexOf(nameEQ) == 0) return c.substring(nameEQ.length,c.length);  
    }  
    return null;  
}  
  
var value = getCookie('key');