nodejs+express框架实现登录过滤器以及用户登入状态的保存

之前用express框架搭建一个后台管理应用,主要是学习node如何编写接口。今天带大家学习node如何实现过滤器,以及用户信息状态如何存储。
先来了解中间件:cookie-parser模块与express-session模块。
cookie-parser模块:这个是为了方便操作客户端中的cookie值,区别于session。

npm i cookie-parser --save
app.js文件
引入中间件
var cookieParser = require('cookie-parser')
使用中间件
app.use(cookieParser('123456'));
设置cookie
res.cookies('key','value',option);具体的option配置可查看其它博文
是否传参数的影响:
1、在使用中间的时候是否传参其实就是是否加密,那么传参之后的加密效果如下图。
2、在设置cookie值时,如果将属性signed设置为true时,则必须传参。

在后端种好cookie之后,浏览器会出现如下图片:
在这里插入图片描述在这里插入图片描述
express-session模块:session 是另一种记录客户状态的机制, 不同的是 Cookie 保存在客户端浏览器中, 而 session 保存在服务器上。

引入express-session
npm i express-session --save
app.js文件
var session = require("express-session");		
app.use(session({
	secret: '123456',
    resave: false,
    saveUninitialized: true
}));

以上代码就将两个中间件引入当自己的项目当中了,那如何使用,并且在哪里使用。如下例子可以说明:
注册接口:将用户输入的信息存到数据库当中。

var express = require('express');
const request = require('request');
const queryString=require('query-string');
var router = express.Router();
var db=require('../sql/db.js');
router.get('/',(req,res,next)=>{
	let username,password;
	if(Object.keys(req.query).length===2){
		username=req.query.name;
		password=req.query.password;
		db({database:'hhl'},"INSERT INTO user(username,password) VALUES ('"+username+"','"+password+"')",function(result,fields){
			res.send('注册成功!!')
		})
	}
})

module.exports=router;

登入接口代码:在这个接口当中,查询数据库,并且将查询的结果种到cookie当中,存在session中,那么下次想获取用户信息则直接在session中获取。

login.js
var express = require('express');
var router = express.Router();
var db=require('../sql/db.js');
router.get('/', function(req, res, next) {
	let name,password;
	if(Object.keys(req.query).length==2){
		name=req.query.name;		//用户名
		password=req.query.password;	//用户密码
		db({database:'hhl'},"SELECT username,password FROM user WHERE username='"+name+"' AND password='"+password+"'",function(result,fields){
			if(!result.length){
				res.send('登入失败!!');
			}else{
				req.session.auth_username=name;
				req.session.auth_password=password;
				res.cookie('username',name, {maxAge:1000 * 60 * 60 * 24 * 7,signed:true});		//设置cookie的保存时间,7天为例
				res.cookie('password',password, {maxAge: 1000 * 60 * 60 * 24 * 7,signed:true});	//console.log(req.signedCookies);
				res.send('登入成功!!');
			}
		})
	}
	
});

module.exports = router;

设置完成之后的cookie值如图片
在这里插入图片描述
注销接口:
将session,cookie的值都删除。

var express = require('express');
const queryString=require('query-string');
var router = express.Router();
var db=require('../sql/db.js');
router.get('/',(req,res,next)=>{
	let user=req.session.auth_username;
	let pass=req.session.auth_password
	res.cookie('username',user, {maxAge:0,signed:true});		
	res.cookie('password',pass, {maxAge:0,signed:true});
	req.session.auth_password=undefined;
	req.session.auth_username=undefined;
	let {username,password}=req.signedCookies;
	console.log(req.session.auth_username && req.session.auth_password,username,password)
	res.send('注销成功!!');
})

module.exports=router;

获取图片接口:(这个接口就是用来做测试的)

var express = require('express');
var router = express.Router();
var path = require('path');
var multiparty = require('multiparty');
router.get('/',(req,res,next)=>{
	res.send({ 
      status:"200",
      msg:"成功!",
      img:'http://localhost:3000/images/home1.png'
  });
})

那么重点关注对象----过滤器怎么实现。代码如下
session关闭浏览器这信息就没了,如果使用cookie来实现信息的有效保存。
实现思路:
1、判断是否存在session
是 next
否 判断是否有cookie
是 将cookie值取出来赋值给session 并且next
否 获取请求地址,白名单login,relogin接口 next

app.use(function(req,res,next){
		if(!(req.session.auth_username && req.session.auth_password)){
			console.log('无session');
			if(req.signedCookies.username && req.signedCookies.password){
				console.log('有cookie')
				let {username,password}=req.signedCookies;
				req.session.auth_username=username;
				req.session.auth_password=password;			//将cookie的值存在session里
				next();
			}else{
				let arr=req.url.split('/');
				console.log('无cookie',arr);
				let index=arr && arr.findIndex((item)=>{
					return (item.indexOf('login')!=-1 || item.indexOf('relogin')!=-1);
				});
				if(index!==-1){
					next();
				}else{
					return res.status(401).json({
					    msg: '没有登入,请先登入'
					 })
				}
			}
		}else{
			console.log('有session',req.session.auth_username && req.session.auth_password);
			next();
		}
})

代码思路检验:
1、还没登入点注销出现如下图:说明被拦截
在这里插入图片描述
2、点击登入的图片:
在这里插入图片描述
3、点击登入之后,获取图片:
在这里插入图片描述
4、点击注销:
在这里插入图片描述
5、最后再获取图片一下:

在这里插入图片描述

过滤器以及登入注销的实现就完成啦~~来总结一下:
坑1:过滤器一定要放在路由导向之前。
坑2:sql拼接一定要心细心细再心细。
优化建议:
如上的代码就是将具体功能实现了而已,并不完美。可以将过滤再起一个文件夹,因为项目当中可以用的的过滤器,拦截器不止一个。最后在app.js引入就行,这样看的舒服。再者,每个接口的都需要优化,比如注册接口的用户账户判重,密码强弱设置,以及友好的用户提示等等之类的功能。

  • 2
    点赞
  • 11
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值