项目实战：博客项目

一、项目概括

1 功能描述

   设计一个博客文章管理系统，使之具有管理员登录验证、密码加密、显示、新增、修改、删除、查询用户和文章、数据分页、退出登录等功能。

2 具体设计信息

• 用户信息包括：用户编号、用户名、邮箱、密码、角色、状态。
• 文章信息包括：ID、标题、发布时间、作者。

3 技术栈选择

   mongodb + express框架 + node.js

4 项目文件结构

二、案例初始化

1. 建立项目所需文件夹

• public 静态资源
• model 数据库操作
• route 路由
• views 模板

2. 初始化项目描述文件

• 使用 npm init -y 生成 package.json 文件

3. 下载项目所需第三方模块

npm install express mongoose art-template express-art-template

4. 创建网站服务器

• app.js 项目入口文件\项目主文件

// 引入 express 框架
const express = require('express');

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

// 监听80端口
app.listen(80);
console.log('服务器已启动');

5. 构建模块化路由

• route/home.js 创建博客展示页面路由

// 引入 express 框架
const express = require('express');

//创建博客展示页面路由对象
const home = express.Router();


home.get('/home', (req, res) => {
   
   res.send('欢迎来到博客首页');
});

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

• route/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('/user', require('./admin/userPage'));

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

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

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

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

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

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

• 将home、admin路由引入到app.js中

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

//将路由和请求路径进行匹配
app.use('/home', home);
app.use('/admin', admin);

6. 构建博客管理页面模板

需要注意：

1. 静态资源的外链文件，是浏览器解析的，所以相对路径是相对于浏览器的请求地址。

<link href="/admin/css/boot-crm.css" rel="stylesheet" type="text/css" />

3. 模板的路径是由模板引擎来解析的，所以写相对路径是没有问题的。

{
   {
   include './common/header'}}

三、登录功能

1. 创建用户集合，初始化用户

1.1 连接数据库

model/connect.js,代码如下：

//连接数据库

// 引入系统模块mongoose
const mongoose = require('mongoose');
// 数据库连接   27017是mongodb数据库的默认端口
mongoose.connect('mongodb://localhost/blog', {
    useNewUrlParser: true, useUnifiedTopology: true })
    .then(() => console.log('数据库连接成功')) //连接成功
    .catch((err) => console.log(err, '数据库连接失败')); //连接失败

1.2 创建用户集合

model/user.js,代码如下：

const mongoose = require('mongoose');
//创建用户集合规则
const userSchema = new mongoose.Schema({
   
    username: {
   
        type: String,
        //true表示title 属性必传；后面的是错误提示内容
        required: [true, '请传入用户名'],
        //最小长度是2，最大长度是5
        minlength: [2, '姓名长度不能小于2'],
        maxlength: [20, '姓名长度最大不能超过20']
    },
    email: {
   
        type: String,
        //保证邮箱地址在插入数据库时不重复
        unique: true,
        required: true
    },
    password: {
   
        type: String,
        required: true
    },
    role: {
   
        type: String,
        required: true
    },
    //0 启用状态
    //1 禁用状态
    state: {
   
        type: Number,
        default: 0
    },
});
//使用规则，创建集合,返回集合构造函数(参数一：集合名称；参数二：集合规则)
const User = mongoose.model('User', userSchema