-
实现效果如下
前后端分离token登录身份验证效果演示
-
node-jsonwebtoken
基于node实现的jwt方案, jwt也就是jsonwebtoken, 是一个web规范可以去了解一下~
一个标准的jwt由三部分组成
第一部分:头部
第二部分:载荷,比如可以填入加密后的用户信息 (填入的信息一定要加密,jwt本质上是明文传输, 用于防篡改而不是做验证)
第三部分:签名信息
使用node-jsonwebtoken
的理由
开源
实现了服务端设置jwt有效时间,服务端主动作废token -
签名jwt
服务端使用密钥加密jwt的签名部分然后将jwt发送给客户端,客户端将jwt保存,可以保持在localStorage或者Cookie,由于服务端能够控制jwt过期时间(这里应该是代码实现而不是jwt的标准), 所以放在localStorage或许是一种更现代化的解决方案 -
标准jwt防篡改防伪造验证流程
服务端通过key生成一个签名,通过 签名+信息=jwt
jwt发到客户端
客户端带jwt到服务端验证
服务端通过key和jwt的信息再生成一次签名和jwt的签名做对比
对比成功, 验证通过
对比失败, 验证不通过
至始至终key只存在于服务端,只要key不泄露, jwt就无法被篡改被伪造 -
到这里, 我们已经实现了jwt登录验证, 但是需要注意的是jwt是明文传输的,也就是说用户的密码暴露在token里面, 更进一步, 我们可以对jwt的载荷再加密一次,即使token暴露,用户的密码也不会暴露,服务端只要作废这个token就可以了。
-
使用第十七天的教程对jwt的载荷进行加密
-
基于这些可以轻松实现无感刷新token
-
jwt 是一个身份令牌而不是一种安全手段
-
至此用户密码的暴露只存在于用户登录的那个接口请求过程,需要前端配合处理例如使用
JSEncrypt
-
到底哪些加密是必须的哪些是无用的, 还需要具体业务来梳理
-
贴一下后端主模块代码
var createError = require('http-errors'); var express = require('express'); var path = require('path'); var cookieParser = require('cookie-parser'); var logger = require('morgan'); const cors = require('cors'); const jwt = require('jsonwebtoken'); const fs = require('fs'); const { encrypt, decrypt } = require('./rsa'); var indexRouter = require('./routes/index'); var usersRouter = require('./routes/users'); var app = express(); // view engine setup app.set('views', path.join(__dirname, 'views')); app.set('view engine', 'hbs'); app.use(logger('dev')); app.use(express.json()); app.use(express.urlencoded({ extended: false })); app.use(cookieParser()); app.use(express.static(path.join(__dirname, 'public'))); app.use( cors({ origin: true, //true 设置为 req.origin.url methods: 'GET,HEAD,PUT,PATCH,POST,DELETE', //容许跨域的请求方式 allowedHeaders: 'x-requested-with,Authorization,token, content-type, x-token', //跨域请求头 preflightContinue: false, // 是否通过next() 传递options请求 给后续中间件 maxAge: 1728000, //options预验结果缓存时间 20天 credentials: true, //携带cookie跨域 optionsSuccessStatus: 200 //options 请求返回状态码 }) ); const verifyOptions = {}; const jwtKey = fs.readFileSync(path.join(process.cwd(), '/auth/jwt.cer'), 'utf-8'); app.post('/login', (req, res, next) => { const { user, pwd } = req.body; // 加密jwt(token)载荷 const encrypt_info = encrypt(JSON.stringify({ user, pwd })); delete verifyOptions.maxAge; // 签发jwt(token) const token = jwt.sign({ info: encrypt_info }, jwtKey, { // 有效时间 expiresIn: '60s' }); res.send({ msg: 'ok', token }); }); app.post('/request', (req, res, next) => { const token = req.headers['x-token']; // 验证jwt(token) jwt.verify(token, jwtKey, verifyOptions, (err, decoded) => { if (err) { res.send({ msg: 'token error' }); return; } // 解密jwt(token)载荷 处理业务 const decrypt_info = JSON.parse(decrypt(decoded.info)); res.send({ msg: `welcome ${decrypt_info.user}` }); }); }); app.post('/logout', (req, res, next) => { const token = req.headers['x-token']; // 作废jwt(token) verifyOptions.maxAge = '0s'; jwt.verify(token, jwtKey, verifyOptions, (err, decoded) => { res.send({ msg: 'logout' }); }); }); app.use('/', indexRouter); app.use('/users', usersRouter); // catch 404 and forward to error handler app.use(function (req, res, next) { next(createError(404)); }); // error handler app.use(function (err, req, res, next) { // set locals, only providing error in development res.locals.message = err.message; res.locals.error = req.app.get('env') === 'development' ? err : {}; // render the error page res.status(err.status || 500); res.render('error'); }); module.exports = app;