Node.js的Koa实现JWT用户认证方法


Posted in Javascript onMay 05, 2018

本文介绍了Node.js的Koa实现JWT用户认证方法,分享给大家,具体如下:

Node.js的Koa实现JWT用户认证方法

一、前置知识

  1. 基于Token的身份验证
  2. Koajs 中文文档
  3. Koa 框架教程

二、环境

  1. Microsoft Visual Studio 2017集成开发环境
  2. Node.js v8.9.4Javascript运行环境

三、开始动手,一步步来完善

1、创建基础的静态资源服务器、基础架构

以下是基本的代码,实现静态服务器,以及一个当token验证异常时候的处理。

下面我们将在这个基本代码下逐步增加注册、登录、信息的功能。

const path = require('path');  // 用于处理目录路径
const Koa = require('koa');  // web开发框架
const serve = require('koa-static'); // 静态资源处理
const route = require('koa-route'); // 路由中间件
const jwt = require('jsonwebtoken'); // 用于签发、解析`token`
const jwtKoa = require('koa-jwt'); // 用于路由权限控制
const koaBody = require('koa-body'); // 用于查询字符串解析到`ctx.request.query`
const app = new Koa();
const website = {
 scheme: 'http',
 host: 'localhost',
 port: 1337,
 join: function () {
 return `${this.scheme}://${this.host}:${this.port}`
 }
}

/* jwt密钥 */
const secret = 'secret';

/* 当token验证异常时候的处理,如token过期、token错误 */
app.use((ctx, next) => {
 return next().catch((err) => {
 if (err.status === 401) {
  ctx.status = 401;
  ctx.body = {
  ok: false,
  msg: err.originalError ? err.originalError.message : err.message
  }
 } else {
  throw err;
 }
 });
});

/* 查询字符串解析到`ctx.request.query` */
app.use(koaBody());

/* 路由权限控制 */
// 待办事项……

/* POST /api/register 注册 */
// 待办事项……

/* GET /api/login 登录 */
// 待办事项……

/* GET /api/info 信息 */
// 待办事项……

/* 静态资源处理 */
app.use(serve(path.join(__dirname, 'static')));
/* 监听服务器端口 */
app.listen(website.port, () => {
 console.log(`${website.join()} 服务器已经启动!`);
});

下面,我们将在注册、登录、信息的注释底下添加实现的代码。

2、路由权限控制

注册、登录接口、其它资源不需要认证,信息接口需要认证。

/* 路由权限控制 */
app.use(jwtKoa({ secret: secret }).unless({
 // 设置login、register接口,可以不需要认证访问
 path: [
 /^\/api\/login/,
 /^\/api\/register/,
 /^((?!\/api).)*$/ // 设置除了私有接口外的其它资源,可以不需要认证访问
 ]
}));

3、注册

/* POST /api/register 注册 */
app.use(route.post('/api/register', async (ctx, next) => {
 const body = ctx.request.body;
 /*
 * body = {
 * user : '御焱',
 * password : '123456'
 * }
 */

 // 判断 body.user 和 body.password 格式是否正确
 // 待办事项……

 // 判断用户是否已经注册
 // 待办事项……

 // 保存到新用户到数据库中
 // 待办事项……

 // 是否注册成功
 let 是否注册成功 = true;
 if (是否注册成功) {
 // 返回一个注册成功的JOSN数据给前端
 return ctx.body = {
  ok: true,
  msg: '注册成功',
  token: getToken({ user: body.user, password: body.password })
 }
 } else {
 // 返回一个注册失败的JOSN数据给前端
 return ctx.body = {
  ok: false,
  msg: '注册失败'
 }
 }
}));
/* 获取一个期限为4小时的token */
function getToken(payload = {}) {
 return jwt.sign(payload, secret, { expiresIn: '4h' });
}

Node.js的Koa实现JWT用户认证方法

3、登录

/* GET /api/login 登录 */
app.use(route.get('/api/login', async (ctx, next) => {
 const query = ctx.request.query;
 /*
 * query = {
 * user : '御焱',
 * password : '123456'
 * }
 */

 // 判断 query.user 和 query.password 格式是否正确
 // 待办事项……

 // 判断是否已经注册
 // 待办事项……
 
 // 判断姓名、学号是否正确
 // 待办事项……
 
 return ctx.body = {
 ok: true,
 msg: '登录成功',
 token: getToken({ user: query.user, password: query.password })
 }
}));

Node.js的Koa实现JWT用户认证方法

前端获取到token之后,可以保存在任意本地存储里。

4、信息

/* GET /api/info 信息 */
app.use(route.get('/api/info', async (ctx, next) => {
 // 前端访问时会附带token在请求头
 payload = getJWTPayload(ctx.headers.authorization)
 /*
 * payload = {
 * user : "御焱",
 * iat : 1524042454,
 * exp : 1524056854
 * }
 */

 // 根据 payload.user 查询该用户在数据库中的信息
 // 待办事项……
 const info = {
 name: '御焱',
 age: 10,
 sex: '男'
 }
 let 获取信息成功 = true;
 if (获取信息成功) {
 return ctx.body = {
  ok: true,
  msg: '获取信息成功',
  data: info
 }
 } else {
 return ctx.body = {
  ok: false,
  msg: '获取信息失败'
 }
 }
}));
/* 通过token获取JWT的payload部分 */
function getJWTPayload(token) {
 // 验证并解析JWT
 return jwt.verify(token.split(' ')[1], secret);
}

Node.js的Koa实现JWT用户认证方法

访问需要认证的接口时,需要在request头附带Authorization:Bearer [token]字段。

以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持三水点靠木。

原文链接地址:https://segmentfault.com/a/1190000014727547

Javascript 相关文章推荐
获取非最后一列td值并将title设为该值的方法
Oct 30 Javascript
js用正则表达式来验证表单(比较齐全的资源)
Nov 17 Javascript
同域jQuery(跨)iframe操作DOM(示例代码)
Dec 13 Javascript
JS中如何设置readOnly的值
Dec 25 Javascript
js 处理数组重复元素示例代码
Dec 27 Javascript
用javascript读取xml文件读取节点数据
Aug 12 Javascript
纯js实现无限空间大小的本地存储
Jun 18 Javascript
基于jQuery实现自动轮播旋转木马特效
Nov 02 Javascript
用js实现每隔一秒刷新时间的实例(含年月日时分秒)
Oct 25 Javascript
swiper在angularjs中使用循环轮播失效的解决方法
Sep 27 Javascript
微信小程序五子棋游戏的悔棋实现方法【附demo源码下载】
Feb 20 Javascript
three.js利用射线Raycaster进行碰撞检测
Mar 12 Javascript
浅谈vue项目可以从哪些方面进行优化
May 05 #Javascript
Angular模版驱动表单的使用总结
May 05 #Javascript
浅谈Angular HttpClient简单入门
May 04 #Javascript
Vue项目全局配置微信分享思路详解
May 04 #Javascript
vue嵌套路由与404重定向实现方法分析
May 04 #Javascript
Vue.js最佳实践(五招助你成为vuejs大师)
May 04 #Javascript
详解使用jQuery.i18n.properties实现js国际化
May 04 #jQuery
You might like
过滤掉PHP数组中的重复值的实现代码
2011/07/17 PHP
浅析十款PHP开发框架的对比
2013/07/05 PHP
php获取指定日期之间的各个周和月的起止时间
2014/11/24 PHP
PHP 将数组打乱 shuffle函数的用法及简单实例
2016/06/17 PHP
Thinkphp5.0 框架视图view的比较标签用法分析
2019/10/12 PHP
jquery 框架使用教程 AJAX篇
2009/10/11 Javascript
一个简单的jquery进度条示例
2014/04/28 Javascript
javascript使用for循环批量注册的事件不能正确获取索引值的解决方法
2014/12/20 Javascript
jQuery中scrollTop()方法用法实例
2015/01/16 Javascript
JS设置CSS样式的方式汇总
2017/01/21 Javascript
jquery横向纵向鼠标滚轮全屏切换
2017/02/27 Javascript
underscore之function_动力节点Java学院整理
2017/07/11 Javascript
使用bootstraptable插件实现表格记录的查询、分页、排序操作
2017/08/06 Javascript
Node层模拟实现multipart表单的文件上传示例
2018/01/02 Javascript
JavaScript 隐性类型转换步骤浅析
2018/03/15 Javascript
深入浅析Vue中的Prop
2018/06/10 Javascript
vue项目中常见问题及解决方案(推荐)
2019/10/21 Javascript
ant design中upload组件上传大文件,显示进度条进度的实例
2020/10/29 Javascript
[39:07]LGD vs VP 2018国际邀请赛淘汰赛BO3 第二场 8.21
2018/08/22 DOTA
关于Python的一些学习总结
2018/05/25 Python
Python 确定多项式拟合/回归的阶数实例
2018/12/29 Python
对python for 文件指定行读写操作详解
2018/12/29 Python
对pyqt5中QTabWidget的相关操作详解
2019/06/21 Python
Adobe Html5 Extension开发初体验图文教程
2017/11/14 HTML / CSS
canvas 绘图时位置偏离的问题解决
2020/09/16 HTML / CSS
哥伦比亚最大的网上商店:Linio哥伦比亚
2016/09/25 全球购物
瑞士灯具购物网站:Lampenwelt.ch
2018/07/08 全球购物
10的分与合教学反思
2014/04/30 职场文书
中国梦口号
2014/06/13 职场文书
一个都不能少观后感
2015/06/04 职场文书
签字仪式主持词
2015/07/03 职场文书
2016猴年春节问候语
2015/11/11 职场文书
交通事故协议书范本
2016/03/19 职场文书
灵能百分百第三季什么时候来?
2022/03/15 日漫
Python实现文字pdf转换图片pdf效果
2022/04/03 Python
如何在Python中妥善使用进度条详解
2022/04/05 Python