时间:2021-05-26
本文实例讲述了Vue+Node实现的商城用户管理功能。分享给大家供大家参考,具体如下:
1、用户登陆
前端将用户输入的用户名密码post发送到后端,如果返回status=0,代表登陆成功,将hasLogin置为true,控制页面登陆按钮不显示,并显示返回的用户名nickname
login(){ if(!this.username||!this.password){ this.errMsg="请输入用户名与密码!"; this.errShow=true; }else{ axios.post('/users/login',{ username:this.username, password:this.password }).then((response,err)=>{ let res=response.data; if(res.status===0){ this.hasLogin=true; this.nickname=res.result; this.closeLogin(); }else{ this.errShow=true; this.errMsg=res.msg; } }) } },后端根据前端传来的用户名、密码在数据库中查找指定条目,查询成功返回status=0,并设置res的cookie保存用户名与Id
router.post('/login', function(req, res, next) { let username=req.body.username; let password=req.body.password; let params={ userName:username, userPwd:password }; user.findOne(params,(err,userDoc)=>{ "use strict"; if(err){ res.json({ status:1, msg:err.message }) }else { if(userDoc){ //登陆成功后设置res.cookie与req.session res.cookie('userId',userDoc.userId,{ maxAge:1000*60*60 }); res.cookie('userName',userDoc.userName,{ maxAge:1000*60*60 }); res.json({ status:0, msg:'登陆成功', result:userDoc.userName }); }else{ res.json({ status:1, msg:'用户名或密码错误!' }); } } })});2、服务器Express全局拦截
一些内容在用户未登录是无法访问的,需要服务器对非法请求进行拦截。在nodejs中请求先到达app.js文件,然后再转发到指定路由。在转发之前,可以先对用户登陆状态进行判断,如果cookies中有设置userId,表明已登陆,执行下一步next()。如果未登录,只可以访问指定的路由路径,由req.originalUrl判断是否等于或包含允许的访问路径,用户在未登录时可以访问登陆页面与商品列表页面。如果访问其他路径则返回错误信息“用户未登录”:
//全局拦截app.use(function (req,res,next) { if(req.cookies.userId) next(); //已登陆 //未登录,只能访问登录与商品页面 else if(req.originalUrl==='/users/login'||req.originalUrl.indexOf('/goods')>-1) next(); else{ res.json({ status:3, msg:'用户未登录' }) }});3、校验登陆
在页面加载完成后,需要判断用户是否已经登陆过了,前端向后端发出checkLogin的请求,后端根据cookie中的userId是否设置,返回判断信息,如果登陆则不需要用户再次手动登陆了
router.get('/checkLogin',(req,res)=>{ "use strict"; if(req.cookies.userId){ //设置了cookie,用户已登陆 res.json({ status:0, msg:"登录成功", username:req.cookies.userName }) }else { res.json({ status:3, msg: "未登录" }) }});4、登出
用户的登出操作就是将cookie信息去除,即在后台将用户cookie的有效期置为0
router.get('/logout',(req,res)=>{ "use strict"; res.cookie('userId','',{maxAge:0}); res.cookie('userName','',{maxAge:0}); res.json({ status:0, msg:'登出成功!' })});希望本文所述对大家node.js程序设计有所帮助。
声明:本页内容来源网络,仅供用户参考;我单位不保证亦不表示资料全面及准确无误,也不保证亦不表示这些资料为最新信息,如因任何原因,本网内容或者用户因倚赖本网内容造成任何损失或损害,我单位将不会负任何法律责任。如涉及版权问题,请提交至online#300.cn邮箱联系删除。
本文实例讲述了Vue+Node实现商品列表的分页、排序、筛选,添加购物车功能。分享给大家供大家参考,具体如下:1、分页商品列表的分页实现是后台根据前端请求的页面
本文为大家分享了node和vue商城用户地址模块的实现,供大家参考,具体内容如下server/models/user.jsvarmongoose=require
本文实例讲述了Vue+Node服务器查询Mongo数据库及页面数据传递操作。分享给大家供大家参考,具体如下:1、利用Mongoose查询MongoDB通过mon
由于最近开发的个人博客(Vue+node)在使用过程中,发现网络加载有点慢,所以打算对它进行一次优化。本次优化的目标如下:index.html设置成no-cac
一个比较头疼的事情,有些插件绑定dom对象的,然后又用jq的语法,比如你在vue+node的时候,基本就要百度方法我提供一个另类解决方案比如你下了个轮播图插件a