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 相关文章推荐
jQuery asp.net 用json格式返回自定义对象
Apr 07 Javascript
js 数组的for循环到底应该怎么写?
May 31 Javascript
JavaScript获取网页表单提交方式的方法
Apr 02 Javascript
easyui Draggable组件实现拖动效果
Aug 19 Javascript
AngularJS基础 ng-dblclick 指令用法
Aug 01 Javascript
JavaScript实现窗口抖动效果
Oct 19 Javascript
详解vue2路由vue-router配置(懒加载)
Apr 08 Javascript
koa源码中promise的解读
Nov 13 Javascript
如何用RxJS实现Redux Form
Dec 29 Javascript
详解JavaScript中的Object.is()与"==="运算符总结
Jun 17 Javascript
vue2.0 解决抽取公用js的问题
Jul 31 Javascript
Vue如何循环提取对象数组中的值
Nov 18 Vue.js
浅谈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下一个非常全面获取图象信息的函数
2008/11/20 PHP
PHP计划任务、定时执行任务的实现代码
2011/04/23 PHP
基于Zend的Config机制的应用分析
2013/05/02 PHP
解析PHP 使用curl提交json格式数据
2013/06/29 PHP
Add a Table to a Word Document
2007/06/15 Javascript
Javascript实现单张图片浏览
2014/12/18 Javascript
使用js画图之画切线
2015/01/12 Javascript
jQuery插件animateSlide制作多点滑动幻灯片
2015/06/11 Javascript
基于JavaScript实现通用tab选项卡(通用性强)
2016/01/07 Javascript
JS弹出窗口的运用与技巧大全
2016/11/01 Javascript
PHP 实现一种多文件上传的方法
2017/09/20 Javascript
JavaScript满天星导航栏实现方法
2018/03/08 Javascript
JavaScript对象拷贝与Object.assign用法实例分析
2018/06/20 Javascript
JavaScript文本特效实例小结【3个示例】
2018/12/22 Javascript
小程序测试后台服务的方法(ngrok)
2019/03/08 Javascript
小程序云开发如何实现图片上传及发表文字
2019/05/17 Javascript
为vue项目自动设置请求状态的配置方法
2019/06/09 Javascript
vue + node如何通过一个Txt文件批量生成MP3并压缩成Zip
2020/06/02 Javascript
在vue中实现echarts随窗体变化
2020/07/27 Javascript
[03:01]2014DOTA2国际邀请赛 DC:我是核弹粉,为Burning和国土祝福
2014/07/13 DOTA
python开发之tkinter实现图形随鼠标移动的方法
2015/11/11 Python
python将list转为matrix的方法
2018/12/12 Python
Python 数据库操作 SQLAlchemy的示例代码
2019/02/18 Python
Pycharm创建python文件自动添加日期作者等信息(步骤详解)
2021/02/03 Python
html5中为audio标签增加停止按钮动作实现方法
2013/01/04 HTML / CSS
托管代码(Managed Code)和非托管代码(Unmanaged Code)有什么区别
2014/09/29 面试题
网络工程专业毕业生推荐信
2013/10/28 职场文书
餐厅考勤管理制度
2014/01/28 职场文书
政府绩效管理实施方案
2014/05/04 职场文书
计划生育宣传标语
2014/06/21 职场文书
学生顶撞老师的检讨书
2014/09/17 职场文书
小学一年级数学教学计划
2015/01/20 职场文书
毕业生政审意见范文
2015/06/04 职场文书
Python 制作自动化翻译工具
2021/04/25 Python
上个世纪50年代的可穿戴技术:无线电帽子
2022/02/18 无线电
Vue+Flask实现图片传输功能
2022/04/01 Vue.js