node.js + express + mongoose + express-art-template + mongodb + bootstrap 博客实战项目[黑马程序员]--part02(续)

2021/7/23 2:06:23

本文主要是介绍node.js + express + mongoose + express-art-template + mongodb + bootstrap 博客实战项目[黑马程序员]--part02(续),对大家解决编程问题具有一定的参考价值,需要的程序猿们随着小编来一起学习吧!

1. app.js

// 引入 express 框架
const express = require('express');
// 引入路径处理
const path = require('path');
// 引入express-session 模块z
const session = require('express-session');
// 导入 art-template 模板引擎
const template = require('art-template');
// 全局引入 dateFormat 模块 (用于处理 日期格式)
const dateFormat = require('dateformat');
// 引入 morgan 第三方模块 (用于开发环境 打印请求信息至控制台
const morgan = require('morgan');
// 导入 config 模块
const config = require('config');

//创建网站服务器 
const app = express();

// 数据库连接 (并未返回模块成员 不用变量接收)
require('./model/connect');

// 处理POST请求参数 (extended false  默认使用 querrString 处理字符串)
// 不能处理 form-datal 即 二进制 数据
app.use(express.urlencoded({ extended: false }));

// 配置session
app.use(session({
    resave: true,
    // 在未登录时 客户端不保存 cookie
    saveUninitialized: false,
    secret: 'secret key',
    cookie: {
        // cookie 保存的最长时间 单位:毫秒
        maxAge: 24 * 60 * 60 * 1000
    }
}));

// 向express 指定框架模板所在位置
app.set('views', path.join(__dirname, 'views'));
// 向express 指定框架模板的默认后缀
app.set('view engine', 'art');
// 向文件后缀为 .art 文件,指定渲染所使用的模板引擎
app.engine('art', require('express-art-template'));
// 向模板内部导入 dateFormat 变量 (默认写法)
template.defaults.imports.dateFormat = dateFormat;

// 开放静态资源文件 符号 / 代表其根目录 即 该路径
app.use(express.static(path.join(__dirname, 'public')));

// 拦截请求,判断用户登录状态
// 由于中间件的执行顺序是代码从上至下执行,所以应放在路由匹配中间件之前
// 引入 登录拦截模块
app.use('/admin', require('./middleware/loginGuard'));

// 获取当前系统的配置信息 
console.log(config.get('title'));

// 获取系统环境变量(返回值为 对象数据类型)
// console.log(process.env);
// 根据系统环境变量中的 变量名 NODE_ENV 获取变量值
// process.env.NODE_ENV;
// 进行判断
// if (process.env.NODE_ENV == 'development') {
//     // 当前是 开发环境
//     console.log('当前是开发环境');
//     // 在开发环境中 将客户端发送到服务器端的请求信息打印到控制台中
//     app.use(morgan('dev'));
// } else {
//     // 当前是 生产环境
//     console.log('当前是生产环境');
// };

// 引入路由模块
const home = require('./route/home');
const admin = require('./route/admin');

// 为路由匹配请求路径
app.use('/home', home);
app.use('/admin', admin);

// 错误处理中间件
app.use((err, req, res, next) => {
    // 将字符串数据类型转化为对象数据类型
    const result = JSON.parse(err);
    // 空数组
    let params = [];
    // 遍历对象 填充数组
    for (let attr in result) {
        if (attr != 'path') {
            params.push(attr + '=' + result[attr]);
        }
    };
    // message 后 通过 & 进行拼接
    res.redirect(`${result.path}?${params.join('&')}`);
});

// 监听端口 80  浏览器默认给 url添加 80端口
app.listen(80);
// 启动成功后 命令行打印
console.log('网站服务器启动成功,请访问:localhost');

2. loginGuard.js

// 导出模块
module.exports = (req, res, next) => {

    // 字符截取 (这里是为了做 文章专项路由)
    let subUrl = req.url.substring(0, 6);

    // 判断用户访问的是否为登录页面 以及 用户的登录状态
    // 若 用户是登录状态,则放行请求
    // 若 用户是非登录状态,则将请求重定向至登录页面
    if (subUrl != '/login' && !req.session.username) {
        // req.session.username 见admin.js 第36行,若用户为登录状态则 session对象下应该有username属性,反之则没有
        res.redirect('/admin/login');

    } else {
        // 用户为登录状态 放行请求
        // 如果该用户为 普通用户
        if (req.session.role == 'normal') {

            // 页面跳转至 博客首页 并阻止代码向下执行
            return res.redirect('/home/?message=登录成功');

        } else {
            // 如果该用户为 超级用户 admin
            next();
        }
    };
};

login.js

// 导入 bcryptjs
const bcrypt = require('bcryptjs');
// 导入用户集合构造函数
const { User } = require('../../model/user');


// 导出模块
module.exports = async(req, res) => {
    // (async 异步函数标记)


    // 接收post请求参数
    const { email, password, aid } = req.body;


    // 如果客户端浏览器禁用 js 运行,则客户端进行的账号和密码验证将失效
    // 为此在服务端我们增加验证功能
    if (email.length == 0 || password.length == 0) return res.status(400).render('admin/error', { msg: '邮件地址或密码错误' });
    // 根据邮箱地址查询用户信息 (参数 ES6写法 键值对相等 写其一)
    // 如果查询到用户 userData 变量类型为对象类型
    // 如果没有查询到用户 userData 变量为空
    let userData = await User.findOne({ email });

    if (userData) {
        // 查询到用户
        // 将客户端传递过来的密码 与 数据库中用户信息的密码进行比对
        // true 对比成功 false 对比失败
        let isValid = bcrypt.compare(password, userData.password)
        if (isValid) {
            // 登录成功
            // 将用户名存储在请求对象中
            // session 是 express-session 提供的对象(存储信息时,会自动创建 sessionId)
            req.session.username = userData.username;
            // 将用户角色 存储在 session 对象中
            req.session.role = userData.role;
            // res.send('登录成功');
            // req.app 即 app.js 文件中的 app(即 express() 的实例化对象)
            // app.local 可以理解为 全局对象,所有 template 模板均可拿到
            req.app.locals.userInfo = userData;

            // 专项跳转
            // 对用户的角色进行判断
            if (userData.role == 'admin') {
                // 管理员  重定向到 usersList 页面
                res.redirect('/admin/usersList');
            } else {
                if (aid) {
                    // 重定向至 原文章(aid对应的文章)页面
                    res.redirect('/home/article?aid=' + aid)
                } else {
                    // 普通用户 重定向至 博客首页
                    res.redirect('/home');
                }

            };



        } else {
            // 没有查询到用户
            res.status(400).render('admin/error', { msg: '邮件地址或密码错误' });
        };

    } else {
        // 没有查询到用户
        res.status(400).render('admin/error', { msg: '邮件地址或密码错误' });
    };
};

2.1. 文章专项路由

为实现以下流程(登录后仍跳转至该页面):

 aid:即该文章 _id,以此作为唯一标识符,方便进行之后的页面跳转

2.2. 判断用户的登录状态

3. 路由模块

3.1. admin.js

// 引用 express 框架
const express = require('express');
// 创建博客展示页面路由
const admin = express.Router();

//渲染登录页面 路由 (导入登录页面模块
admin.get('/login', require('./admin/loginPage'));

// 实现登录功能 路由 (导入登录模块
admin.post('/login', require('./admin/login'));

// 实现退出功能 路由
admin.get('/logout', require('./admin/logout'));

// 用户系路由

// 创建 用户列表页面 路由
admin.get('/usersList', require('./admin/usersList'));

// 创建 用户编辑页面 路由
admin.get('/user-edit', require('./admin/user-edit'))

// 创建实现 用户添加功能 路由
admin.post('/user-add', require('./admin/user-add'));

// 创建实现 修改用户信息功能 路由
admin.post('/user-modify', require('./admin/user-modify'));

// 创建实现 删除用户功能 路由
admin.get('/user-delete', require('./admin/user-delete'));

// 文章系路由

// 创建 文章列表页面 路由
admin.get('/articlesList', require('./admin/articlesList'));

// 创建 文章编辑页面 路由
admin.get('/article-edit', require('./admin/article-edit'))

// 创建 文章添加功能 路由
admin.post('/article-add', require('./admin/article-add'))

// 创建实现 修改文章功能 路由
admin.post('/article-modify', require('./admin/article-modify'));

// 创建实现 删除文章功能 路由
admin.get('/article-delete', require('./admin/article-delete'));


// 将路由对象作为模块成员进行导出
module.exports = admin;

 3.2. 具体功能实现

3.2.1. 用户添加 user-add.js

// 引入用户集合的构造函数
const { User, validateUser } = require('../../model/user');
// 引入加密模块
const bcrypt = require('bcryptjs');

module.exports = async(req, res, next) => {

    // 用户验证
    try {
        await validateUser(req.body);
    } catch (err) {
        // 验证未通过
        // 重定向至用户添加页面 (重定向结束后,会执行 res.end() )
        // return res.redirect(`/admin/user-edit?message=${err.message}`);
        // JSON.stringify() 将对象数据数据类型转化内字符串数据类型 
        let redData = { path: '/admin/user-edit', message: err.message };
        return next(JSON.stringify(redData));
    };

    // 根据邮箱地址查询用户是否已存在
    let user = await User.findOne({ email: req.body.email });
    // 如果用户已经存在
    if (user) {
        // 重定向至用户添加页面 (重定向结束后,会执行 res.end() )
        // return res.redirect(`/admin/user-edit?message=该邮箱地址已经被占用`);
        let redData = { path: '/admin/user-edit', message: '该邮箱地址已经被占用' };
        return next(JSON.stringify(redData));
    };
    // 对密码进行加密处理
    // 生成随机字符串
    const salt = await bcrypt.genSalt(10);
    // 加密
    const bcryptPassword = await bcrypt.hash(req.body.password, salt);
    // 加密后密码替换 原密码
    req.body.password = bcryptPassword;

    // 将用户信息添加到数据库
    await User.create(req.body);
    // 重定向至用户编辑页面 (重定向结束后,会执行 res.end() )
    // return res.redirect(`/admin/usersList`);
    let redData = { path: '/admin/user-edit', message: '用户添加成功!' };
    return next(JSON.stringify(redData));
};

3.2.2. 用户删除 user-delete.js

// 引入 用户集合 的构造函数
const { User } = require('../../model/user');

module.exports = async(req, res) => {
    // 解构对象 获得 id
    let { userId } = req.query;

    // 根据 id 删除用户
    await User.findOneAndDelete({ _id: id });

    // 重定向至用户列表页面
    res.redirect('/admin/usersList');
};

3.2.3. 用户编辑 user-edit.js

// 引入用户集合的构造函数
const { User } = require('../../model/user');

module.exports = async(req, res) => {

    // 路由标识 (标识当前为 用户编辑 页面)
    req.app.locals.currentLink = 'user-edit';

    // 获取 url 中相关信息
    let { message, id } = req.query;

    // 针对 是否有 id 进而判断 是添加用户 或是 修改用户信息
    if (id) {
        // 修改用户信息
        let user = await User.findOne({ _id: id });
        // 渲染 用户编辑页面(修改用户信息)
        res.render('admin/user-edit', {
            message,
            user,
            link: '/admin/user-modify?id=' + id,
            btnTxt: '修改',
            userId: '用户id:' + id
        });

    } else {
        // 渲染 用户编辑页面(添加修改用户)
        res.render('admin/user-edit', {
            message,
            link: '/admin/user-add',
            btnTxt: '添加'
        });
    };
};

3.2.4. 用户修改 user-modify.js

// 导入用户集合的构造函数
const { User } = require('../../model/user');
// 引入加密模块
const bcrypt = require('bcryptjs');

module.exports = async(req, res, next) => {

    // 接收 post 传递的 参数
    let { username, email, password, role, state } = req.body;
    // 接收 get 传递的 id
    let { id } = req.query;

    let userData = await User.findOne({ _id: id });

    // 密码比对 (参数1: 接收的密码; 参数2:数据库中保存的密码)
    const isValid = await bcrypt.compare(password, userData.password);

    // 比对结果
    if (isValid) {
        // 密码相等
        await User.updateOne({ _id: id }, {
            username,
            email,
            role,
            state
        });

        // 页面重定向至 用户列表页面
        res.redirect('/admin/usersList');
    } else {
        // 密码不等
        // 信息填充 
        let info = {
            path: '/admin/user-edit',
            message: '密码错误! 信息修改失败.',
            id
        };
        // next() 方法的第一个参数传递字符串 (JSON.stringify() 对象转字符串)
        next(JSON.stringify(info));
    };

};

 3.2.5. 用户列表渲染 usersList.js

// 导入用户集合构造函数
const { User } = require('../../model/user')

module.exports = async(req, res) => {

    // 路由标识 (标识当前为 用户列表 页面)
    req.app.locals.currentLink = 'usersList';

    // 接收客户端传递过来的 当前页 参数
    let page = req.query.page || 1;
    // 每一页显示的数据条数
    let pageSize = 10;
    // 用户数据的总条数
    let count = await User.countDocuments();
    // 总页数(向上取整)
    let total = Math.ceil(count / pageSize);
    // 页码对应的数据查询开始位置
    let start = (page - 1) * pageSize;

    let users = await User.find().limit(pageSize).skip(start);
    // res.send(users);
    // 渲染用户列表页面
    res.render('admin/usersList', {
        users,
        page,
        total,
        count
    });

};


这篇关于node.js + express + mongoose + express-art-template + mongodb + bootstrap 博客实战项目[黑马程序员]--part02(续)的文章就介绍到这儿,希望我们推荐的文章对大家有所帮助,也希望大家多多支持为之网!


扫一扫关注最新编程教程