Cookie
Cookie是一种存储在用户计算机上的小文件，它包含了网站的一些信息。Cookie主要用于跟踪用户行为和提供个性化体验。例如，当用户登录网站时，网站会创建一个名为“session”的Cookie，并将其存储在用户计算机上。每次用户浏览该网站时，Cookie都会被发送到服务器，以便服务器可以识别用户并提供相应的内容。
示例：
// 创建cookie
document.cookie = "username=John Doe; expires=Thu, 18 Dec 2022 12:00:00 UTC; path=/";
// 读取cookie
var username = getCookie("username");
function getCookie(name) {
var cookieArr = document.cookie.split(';');
for(var i = 0; i < cookieArr.length; i++) {
var cookiePair = cookieArr[i].split('=');
if(name === cookiePair[0].trim()) {
return decodeURIComponent(cookiePair[1]);
}
}
return null;
}
优点：
- 简单易用，客户端支持良好。
- 可以跨多个页面使用，方便进行用户跟踪和数据传输。
缺点：
- 存储在客户端，可能会有安全隐患。
- 存储空间受限，一般不超过4KB。
- 不能共享或跨域使用因为会有安全隐患，例如 iframe 嵌入后会有影响，这里不建议使用Cookie存储数据，可以使用localStorage存储。
Session
会话(Session)则是一种服务器端的存储技术，在用户访问网站时，服务器会分配一个唯一的会话ID给客户端，这个会话ID会存在Cookie里，同时服务器也会保存这个会话ID对应的状态和数据，直到用户退出或会话超时结束。在Web应用中，Session通常用于存储用户的身份验证凭据和其他敏感信息，如购物车内容等。
示例：
// 服务器端创建session
const session = require('express-session');
app.use(session({
secret: 'my-secret-key',
resave: false,
saveUninitialized: true,
cookie: { secure: true }
}));
// 存储数据
app.get('/cart', function(req, res) {
req.session.cart = cart;
});
// 获取数据
app.get('/order', function(req, res) {
const cart = req.session.cart;
});
优点：
- 安全性更高，因为存储在服务器端。
- 可以存储更多的信息，不受限于存储空间。
缺点：
- 需要额外的服务器资源支持，可能会降低性能。
- 不易跨域使用。
Token
Token是一种无状态的身份验证机制，它通过在客户端和服务器之间传递令牌来进行身份验证。当用户登录成功后，服务器会生成一个Token并将其返回给客户端。该Token存储了用户的身份验证信息，例如用户名和密码等，但并未存储在服务器端。每次用户访问需要身份验证的资源时，客户端会将Token发送到服务器以进行身份验证。
优点：
- 可以跨域使用。
- 不需要额外的服务器资源支持，可以轻松扩展。
缺点：
- 需要考虑安全性问题，例如Token被盗用或泄漏等情况。
- Token一旦生成，就无法更改或撤销。
JWT
JWT是一种基于Token的身份验证机制，使用JSON格式编码数据进行传输。
nodeJs示例:
- 安装
npm install jsonwebtoken
- 使用
import jwt from "jsonwebtoken";
// 创建 token
export function createToken<T extends Object>(user: T, time = "10h") {
return jwt.sign({ ...user }, config.TOKEN_BASE, {
expiresIn: time, // token 有效期为 10 个小时
});
}
// 验证token
export function expressToken<T>(token: string | string[]) {
return new Promise<T>((res, rej) => {
jwt.verify(token, config.TOKEN_BASE, function (err, data: T) {
if (err) rej(err);
res(data);
});
});
}
