【前端】NodeJS:记账本案例优化(会话控制)——登录、注册

文章目录

  • [1 checkLoginMiddleware.js](#1 checkLoginMiddleware.js)
  • [2 auth.js](#2 auth.js)
  • [3 app.js](#3 app.js)
  • [4 设置公益404:404.ejs](#4 设置公益404:404.ejs)

1 checkLoginMiddleware.js

javascript 复制代码
//检测登录的中间件
module.exports = (req, res, next) => {
  	//判断
  	if(!req.session.username){
    	return res.redirect('/login');
  	}
  	next();
}

2 auth.js

javascript 复制代码
var express = require('express');
var router = express.Router();
//导入 用户的模型
const UserModel = require('../../models/UserModel');
const md5 = require('md5');
//注册
router.get('/reg', (req, res) => {
  	//响应 HTML 内容
  	res.render('auth/reg');
});

//注册用户
router.post('/reg', (req, res) => {
  	//做表单验证
  	//获取请求体的数据
  	UserModel.create({...req.body, password: md5(req.body.password)}, (err, data) => {
    	if(err){
	      res.status(500).send('注册失败, 请稍后再试~~');
	      return
    	}
    	res.render('success', {msg: '注册成功', url: '/login'});
  	})  
});

//登录页面
router.get('/login', (req, res) => {
  	//响应 HTML 内容
  	res.render('auth/login');
});

//登录操作
router.post('/login', (req, res) => {
  	//获取用户名和密码
  	let {username, password} = req.body;
  	//查询数据库
  	UserModel.findOne({username: username, password: md5(password)}, (err, data) => {
    	//判断
    	if(err){
      		res.status(500).send('登录, 请稍后再试~~');
      		return
    	}
    	//判断 data
    	if(!data){
      		return res.send('账号或密码错误~~');
    	}
    	//写入session
    	req.session.username = data.username;
    	req.session._id = data._id;

    	//登录成功响应
    	res.render('success', {msg: '登录成功', url: '/account'});
  	})
});

//退出登录
router.post('/logout', (req, res) => {
  	//销毁 session
  	req.session.destroy(() => {
    	res.render('success', {msg: '退出成功', url: '/login'});
  	})
});

module.exports = router;

3 app.js

javascript 复制代码
const authRouter = require('./routes/web/auth');
app.use('/', authRouter);
// catch 404 and forward to error handler
app.use(function(req, res, next) {
  	//响应 404 
  	res.render('404');
});

4 设置公益404:404.ejs

html 复制代码
<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <meta http-equiv="X-UA-Compatible" content="IE=edge">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>404</title>
</head>
<body>
  <script src="//volunteer.cdn-go.cn/404/latest/404.js"></script>
</body>
</html>
相关推荐
AI浩7 小时前
【Labelme数据操作】LabelMe标注批量复制工具 - 完整教程
运维·服务器·前端
涔溪7 小时前
CSS 网格布局(Grid Layout)核心概念、基础语法、常用属性、实战示例和进阶技巧全面讲解
前端·css
2401_878454537 小时前
浏览器工作原理
前端·javascript
西陵8 小时前
为什么说 AI 赋能前端开发,已经不是选择题,而是必然趋势?
前端·架构·ai编程
by__csdn9 小时前
Vue3 setup()函数终极攻略:从入门到精通
开发语言·前端·javascript·vue.js·性能优化·typescript·ecmascript
天天扭码9 小时前
前端如何实现RAG?一文带你速通,使用RAG实现长期记忆
前端·node.js·ai编程
Luna-player9 小时前
在前端中,<a> 标签的 href=“javascript:;“ 这个是什么意思
开发语言·前端·javascript
lionliu051910 小时前
js的扩展运算符的理解
前端·javascript·vue.js
小草cys10 小时前
项目7-七彩天气app任务7.4.2“关于”弹窗
开发语言·前端·javascript
奇舞精选10 小时前
GELab-Zero 技术解析:当豆包联手中兴,开源界如何守住端侧 AI 的“最后防线”?
前端·aigc