引入:为啥要自行存储用户的信息?

  • 因为客户端和服务端的交互必然用到http协议,但是http协议是一种无状态协议,用户第一次访问之后,是不存储用户信息的。在第二次访问的时候,不知道是你又来了。又要用户重新进行请求。所以要手动存储用户的信息。

一、cookies

1、安装
npm i cookies -S2、使用

//所有操作均在 router 中写
--------设置Cookies--------
//引入插件
const Cookies = require("cookies")
// 在登录验证成功之后,进行cookie的设置
...(验证登录成功操作)
//设置cookies 为用户登录的ID为例
const cookies = new Cookies(req,res);
cookies.set("USER_iD, payload) //payload 即为要设置的 cookie Value

--------验证Cookies--------
//同样引入插件
const Cookies = require("cookies")
//截取到请求之后,验证cookie来获取用户存储的USER_ID
const cookies = new Cookies(req,res)
const user_id = cookies.get("USER_ID")
//根据user_id 的获取情况来判断用户是否访问过。进一步查找用户全部信息。达到保存用户信息的效果。

二、session

1、安装
npm i connect-mongodb-session express-session -Snpm i express-session -Snpm i mongoose -S1、使用

// --------------app.js 入口文件中写的内容----------------
//express处理session插件
var session = require('express-session');
//把session存放在mongodb数据库中插件
var MongoDBStore = require('connect-mongodb-session')(session);
//创建存放session信息的mongodb表。
var store =  new MongoDBStore({
	uri:"mongodb://localhost:27017/my_app" //这里的my_app是model连接的仓库名。
	collection:"session" //这个名字是存放session的表名。
})
//使用session中间件,设置秘钥和过期时间
app.use(require('express-session')({
    secret: 'hello world', //自定义加密字符串
    cookie: {
        maxAge: 1000 * 60 * 60 * 24 * 7 // 过期时间 1 week   
    },
    store: store,
    resave: true,
    saveUninitialized: true
}));

// --------------router----------------
...(登录验证)
//设置session
req.session.user = result//result 为用户信息
//其他请求验证用户信息
const user = req.session.user
//如果user不为空。则user为用户信息。达到保存用户状态效果。

3、jsonwebtoken (JWT)

1、安装
npm i jsonwebtoken -S2、使用

//------------------后端代码----------------
//引入插件
const JWT = require("jsonwebtoken")
... // 验证登录 。 存储用户信息定为 user_ID
//使用JWT保存用户状态。
//第一步:生成 token 
const token = JWT.sign({
//第一个参数为要加密的某一个用户信息。
ID :user_ID
},
//第二个参数为加密的秘钥字符串
hello world ,
{
//第三个参数为token的过期时间
expiresIn: 7d
}
);

//第二步:讲生成的token存在响应体中,方便客户端进行存储,以及后续请求的携带。
//登录成功
res.json({
	 code: 0,
     message: "ok",
     data: {
       token,
       },
});
//这样登录之后用户的信息就被转换为加密的token 响应回客户端
// -------------------客户端---------------------------
//讲响应体中的token存储到本地缓存中 localStorage
localStorage.setItem("token", data.token);
//利用axios拦截器,在每次请求的时候,加上携带token的请求头
addInterceptors(instance) {
    // 请求拦截器
    instance.interceptors.request.use(
      (config) => {
        // 添加token
        const token = localStorage.getItem("token");
        if (token) {
          config.headers.Authorization =
            "Bearer " + localStorage.getItem("token");
        }
        return config;
      },
      (error) => {
        return Promise.reject(error);
      }
    );
}

//接收到请求后拦截请求,验证 请求头中的 token
// 获取用户的token
const token = req.headers["authorization"].replace("Bearer ", "");
// 解析token
const result = JWT.verify(token, "hello world"); // 第二个参数是当初加密的秘钥。
//进行判断,如果不存在或者解析错误,就没有用户状态,建议重新登录。如果有值,根据ID 进行查询得到用户信息result,从而实现
//保存用户状态。
req.userInfo = result