纯node.js搭建简单博客

说明

使用node.js搭建简单的网站。
这是鄙人第一次做网站,网站逻辑也非常简单,主要是根据黑马程序员的公开课程制作的,但是进行了小范围的逻辑修改。
本文主要介绍后端逻辑。

数据库:mongoDB
node.js web应用框架:Express
前端框架:Bootstrap

环境搭建

安装node.js , 使用express-generator生成器创建脚手架(当然也可以不用脚手架)

入口文件

app.js是入口文件,进行一些配置

var createError = require('http-errors');//错误处理
var express = require('express');//express
var path = require('path');//path模块
var cookieParser = require('cookie-parser');//cookie
var logger = require('morgan');//日志模块
const session =require("express-session");//session
var moment = require('moment');
    moment.locale('zh-cn');
const dataformat = require("dateformat");
const template = require("art-template");
template.defaults.imports.dateformat=dataformat;//模板导入
//数据库连接
require("./model/connect")

//下面是路由模块的导入
var indexRouter = require('./routes/home');
var usersRouter = require('./routes/users');
//建立一个express客户端
var app = express();

//添加的第三方模块处理post强求
const parser =require("body-parser");
app.use(parser.urlencoded({extended :false}))
//处理post请求,所有的post都被parser拦截了,这样的话所有的post请求都会多出来一个body项目

app.use(session({secret:"secret key",    //加密秘钥
                 saveUninitialized:false,//默认cookie
                cookie:{
                     maxAge:24*60*60*1000//过期时间毫秒
                }
         }))//配置session,实现用户识别
//托管静态资源
//需要使用完全路径,因此使用了path模块
//第一个参数是绝对根目录,第二个参数是之后的目录
//一定要在路由器之前托管静态资源!!!注意,html页面是视图模板,不是静态资源
app.use(express.static(path.join(__dirname,"public")));

// view engine setup 视图引擎设置
app.set('views', path.join(__dirname, 'views'));
//指示模板框架的位置
app.set('view engine', 'art');
//提供模板的默认后缀,让系统可以识别你的模板
app.engine("art",require("express-art-template"))
//需要先安装这个模板引擎,然后调用他

//下面是自动调用的几个中间件
app.use(logger('dev'));
app.use(express.json());
app.use(express.urlencoded({ extended: false }));
app.use(cookieParser());
//负责登录拦截
app.use("/users",require("./middleware/loginGuard.js"));
//使用的路由器
app.use('/', indexRouter);//对首页的访问
app.use('/users', usersRouter);//对用户已控制的访问

// catch 404 and forward to error handler 错误处理程序
app.use(function(req, res, next) {
  next(createError(404));
});

// error handler 错误处理中间件
app.use(function(err, req, res, next) {
  // set locals, only providing error in development
  res.locals.message = err.message;
  res.locals.error = req.app.get('env') === 'development' ? err : {};

  // render the error page
  res.status(err.status || 500);
  res.render('error.jade');
});

//测试

module.exports = app; //让这个文件可以被使用

数据库链接

使用mongoose管理数据库

//链接数据库
const mongoose =require("mongoose");
mongoose.connect("mongodb://localhost/blog",{useNewUrlParser:true})
.then(()=>console.log("mongoose 链接成功!"))
.catch(()=>console.log("数据库链接失败"))

这里的代码非常简单,只是进行了简单的链接,链接参数都是默认的,如果没有这个blog文件夹,数据库会自动创建文件夹。

用户逻辑

在app.js中,将用户信息的处理交给“/users”路由器处理
var usersRouter = require('./routes/users');
app.use('/users', usersRouter);//对用户已控制的访问
新建路由器文件,初始化一个路由器
var express = require('express');
var router = express.Router();
用户路由包括以下几个路由

//下面的是渲染用户登录页面的路由 
router.get('/login', function(req, res, next) {
  res.render("users/login")//提供相应的模板引擎渲染
});
//下面是相应用户登录请求的路由
router.post("/login" , require("./users/login.js"))
//实现用户退出的路由
router.get("/logout",require("./users/logout.js"))
//文章管理的实现
//下面的是文章修改页面渲染的路由
router.get('/article-edit', require("./users/article-edit-render"));
//文章列表渲染的路由
router.get("/article",require("./users/article-render"))
//文章添加路由
router.post("/article-add",require("./users/article-add"))
//文章删除路由
router.get("/article-delete",require("./users/article-delete"))
//文章修改路由
router.post("/article-edit",require("./users/article-edit"))
/用户管理的实现
//下面的是用户列表的路由
router.get('/user', require("./users/userpage"));
//下面是用户编辑页面渲染的路由
router.get("/user-edit",require("./users/user-edit-render"))
//下面是用户添加功能的路由相应的是用户编辑页面的post请求
router.post("/user-edit",require("./users/user-edit.js"))
//下面是用户信息修改功能的路由 响应对user-change 的post请求
router.post("/user-change",require("./users/user-change.js"))
//下面是用户删除的路由
router.get("/delete",require("./users/delete"))
用户首页路由
router.get("/home",require("./users/home-render.js"))
//修改头像
router.post("/head-edit",require("./users/head-edit"))

用户集合

用户是存储在数据库中的,所以先建立用户集合

    const mongoose =require("mongoose");
    const userSchema=new mongoose.Schema({
    username :{//用户名
        type : String,//注意大写!!
        require:true,
        minlength:1,//最小长度 //maxlength:最大长度
    },
    email:{//邮箱名
        type : String,
        unique:true,//查重
        require:true
    },
    password:{//密码
        type : String,
        require:true
    },
    role:{//账户类型
        type : String,
        repuire:true
    },
    state:{//账户状态
        type:Number,
        default:0//默认值
    },header:{//头像
        type :String,
        default :"/home/images/logo.png"
    }
})

//获得一个集合的构造函数
const User = mongoose.model("User",userSchema);

这些代码是数据库处理代码。最好放在单独的模块里

渲染用户编辑界面

用户编辑界面不仅需要显示需要编辑的信息,还要渲染来自服务器的错误信息
如果是编辑页面,还要渲染用户的原有信息

const {User}=require("../../model/user")
module.exports=async function(req,res,next){
   req.app.locals.current="user";//标记,保持高亮的
    const {message , id }= req.query//如果出现了错误,会使用message提示
    if(id){//如果有id,证明是用户修改
       let user=await User.findOne({_id:id})//传递两个参数 错误信息 user信息
       res.render("users/user-edit", {message : message ,user:user } );
    }else{
       res.render("users/user-edit", {message : message });//传递一个错误信息
    }
  }

用户新增

用户新增的逻辑是
1.接受服务器传来的表单
2.对信息进行合法性检查
3.操作数据库新增用户

在添加用户之前需要对用户信息进行合法性检查
这里使用了joi第三方模块 网站https://joi.dev/api/?v=17.6.0

const validateUser=(user)=>{
    //定义对象验证规则
    const schema=joi.object({
        username:joi.string().min(1).error(new Error("用户名不符合规则!")).required(),
        email: joi.string().email().error(new Error("没有填写正确的邮箱格式!")).required(),
        password: joi.string().regex(/^[a-zA-Z0-9]{3,30}$/).error(new Error("密码必须由字母或者数字开头!")).required(),
        role:joi.string().valid("normal","admin").error(new Error("角色严重错误")).required(),
        state :joi.number().valid(0,1).error(new Error("状态非法")).required()
   })
   return schema.validate(user);
}

用户的密码需要加密,这里使用了bcryptjs模块,具体的用法请自行查阅
下面是这个路由处理函数的完整代码

//添加修改用户的路由
const joi = require("joi")//引入joi模块
///从数据库模块导入用户集合构造函数
const {User ,validateUser}=require("../../model/user");
//导入数据加密库bcriptjs 这个不需要任何依赖 用来比较密码
const bcrypt = require('bcryptjs');

module.exports =async function(req,res,next){
    const newUser=validateUser(req.body);//使用验证函数验证,产生错误参数
   if(newUser.error){//通过查询字符串的方式携带错误信息,redirect不能直接携带message
        res.redirect(`/users/user-edit?message=${newUser.error.message}`)
        return;//防止报错,终止程序 
    }else{
      //基础验证通过了,验证重复
      const user = await  User.findOne({email: req.body.email})
      if(user){res.redirect(`/users/user-edit?message=邮箱已经被注册!`); return;}//防止报错,终止程序
      const salt=await bcrypt.genSalt(10);//产生“盐"加密密码
      const password = await bcrypt.hash(req.body.password,salt);//哈希加密
      req.body.password=password;
      if(await User.create(req.body)){//添加用户
          res.redirect("/users/user");
      }else{
        res.status(400).render("users/error",{msg:"服务器出现了未知的错误!"})
      }
   }
}

用户登录

用户登录的时候,需要使用bcrypt比较密码
同时需要向session中存储信息,保证在次访问时不需要重新登录

const {User}=require("../../model/user");///从数据库模块导入用户集合构造函数
const bcrypt = require('bcryptjs');//导入数据加密库bcriptjs 这个不需要任何依赖 用来比较密码
module.exports=async (req,res)=>{
    //接受请求参数
   const {email,password}=req.body;
   if(email.trim().length===0||password.trim().length===0){
     return res.status(400).render("users/error",{msg:"邮件地址或密码错误!3S后跳转到原来页面,如果没有,请手动跳转"})
   }//对信息进行初步验证
   //查询用户信息 使用了await 语法 查到了user中就会有信息
   let user=await User.findOne({email : email})//使用findOne查询唯一的信息,只要集合中有这个信息项就会返回这个对象
   if(user){
     //查询到了用户
      if(user.state===0){
          let key=await bcrypt.compare(password,user.password);//实现比对密码
          if(key){
             req.session.username=user.username;//登录成功,向session中存储一些信息
             req.session.role=user.role;
            req.app.locals.userInfo = user;//在模板文件中存储一些信息,显示用户信息
             res.redirect("/") 
          }else{
             res.status(400).render("users/error",{msg:"用户名或者密码错误!"})
          }
      }else{
         res.status(400).render("users/error",{msg:"你的账号被封号了!!!"})
      }
   }else{ 
      res.status(400).render("users/error",{msg:"用户名或者密码错误!"}) 
  }
}

用户修改

用户修改和用户添加是差不多的,但是用户修改时,密码是用来验证的而不是用来修改的

   const {User , validateUser} = require("../../model/user");//引入模块
//导入数据加密库bcriptjs 这个不需要任何依赖 用来比较密码
const bcrypt = require('bcryptjs');
module.exports=async function(req,res,next){
    const userID = req.query.id;//获取信息
    const userMessage=req.body; //获取信息
    let user = await User.findOne({_id:userID});//查询用户
    if(await bcrypt.compare(userMessage.password , user.password)){
      //正确的密码
      const changeUser=validateUser(userMessage);//使用验证函数验证
      if(changeUser.error){//通过查询字符串的方式携带信息,redirect不能直接携带message
        res.redirect(`/users/user-edit?id=${userID}&message=${changeUser.error.message}`)
        return;//防止报错,终止程序 
      }else{//正确的密码 正确的信息格式
        await User.updateOne({_id:userID},{//一定要使用await接受,否则会有问题!写的是要修改的,不用修改的不写
            username:userMessage.username,
            email:userMessage.email,
            role:userMessage.role,
            state:userMessage.state
        })
        res.redirect("/users/user");
      }
    }else{
      //错误的密码
      res.redirect(`/users/user-edit?id=${userID}&message=密码验证错误`)
    }
    
}

管理员查看所有用户

//所有用户信息展示页面渲染路由
const {User}=require("../../model/user.js");//导入用户集合

module.exports=async function(req, res, next) {
    req.app.locals.current="user";//标记高亮
    let page = req.query.page || 1;//获得页数
    //一共有几页?
    let usernum=await User.countDocuments({})//数据的总数
    let total=Math.ceil(usernum/20);//向上取整计算总页数
    let start=(page-1)*20;//计算查询开始的位置
    let users=await User.find({}).limit(20).skip(start);//查询信息
    res.render("users/user",{
          users:users,//用户信息
          page:page,  //当前页面
          total:total,//页面总数
          usernum:usernum//用户总数
    })//提供相应的模板引擎渲染
}

用户头像

用户头像需要文件模块这里使用了formidable 模块

const form = new formidable.IncomingForm();
    //配置服务器文件夹,将客户端上传的文件保存到这里这里必须写绝对路径 __dirname 是这个文件的文件夹
   form.uploadDir = path.join(__dirname,"../","../","public/","upload")
   //解系表单
   form.keepExtensions = true;//保留拓展名
   form.parse(req,async function (err,fields,files){//错误对象 正常信息 文件信息
    //fs.rename(path.normalize(files.cover.filepath),path.normalize(files.cover.filepath)+path.parse(files.cover.originalFilename).ext,(error)=>{if(error) {console.log(error)}}) //如果拓展名保留出现蜜汁问题可以使用原生fs方法改名
     let thepath;
     //下面的代码可以为用户添加默认封面
     //如果表单提交是时候没有携带文件,formidable也会生成一个空文件,我们要把他删除
    if(path.parse(files.cover.originalFilename).ext===""){
        fs.unlink(path.normalize(files.cover.filepath),(err)=>{if(err)console.log("head-edit err in line 17")});
        thepath="/home/images/logo.png";//更改的路径
     }else{
        thepath= (path.normalize(files.cover.filepath)+path.parse(files.cover.originalFilename).ext).split("public")[1];//我不知道为什么文件拓展名保留失败了才这么写,如果保留成功,files.cover.filepath 就是路径了。但是路径要经过裁剪再保存
     }
        await User.updateOne({_id:id},{//更新用户信息
          header:thepath
        })
        req.app.locals.userInfo.header = thepath;//更新一下渲染
    if(err){return console.log(err)}
      res.redirect("/users/home")//更改之后重定向到用户首页 
      })
   }

用户删除

不仅要删除用户信息,还要删除用户的评论,文章,点赞,否则可能会因为读取到undifiend而出现错误

//删除用户的路由
//导入数据库操作
const {User}=require("../../model/user");
const {Comment} = require("../../model/comment")
const {Good}=require("../../model/good")
const {Article}=require("../../model/artical")//文章集合构造函数
module.exports =async function(req,res,next){//使用get请求,信息会被携带在查询字符串中。通过req解析
   Comment.remove({uid : req.query.id },(err)=>{if(err)console.log(err)})//用户的所有评论
   Good.remove({uid : req.query.id },(err)=>{if(err)console.log(err)})//用户的所有点赞
   Article.remove({author: req.query.id },(err)=>{if(err)console.log(err)})//用户的所有文章
   await User.findOneAndDelete({_id:req.query.id});
   res.redirect("/users/user");
}

用户退出

用户退出最简单,删除cookie就可以了

const router = require("../users")
module.exports=function(req,res){
    //删除session
    req.session.destroy(()=>{
    //删除cookie
    res.clearCookie("connect.sid");
    req.app.locals.userInfo= null;//清空userinfo
    res.redirect("/")//重定向
    })
}

登录拦截

用户在没有登录的时候是不能访问管理页面的,所以需要登录拦截
另外普通用户也不能访问用户管理界面

const Guard = (req,res,next)=>{//拦截请求 从session中读取的
if(req.url!="/login"&&req.url.split("?")[0]!="/user-edit"&&!req.session.username){
          res.redirect("/users/login");//不是登录 不是新增用户的
}else{
       if( req.session.role==="normal"&&req.url==="/user")//普通用户不能访问显示所有用户的路由
          return res.redirect(`/users/user-edit?id=${req.app.locals.userInfo._id}`)//res.send()}
        next();//必须"放行!!!
}}
module.exports=Guard;

文章逻辑

文章逻辑基本和用户逻辑是一样的,甚至更简单
建立文章集合

const mongoose =require("mongoose");
//建立集合规则 操作文章数据库
const articalSchema=new mongoose.Schema({
    title:{
        type : String,
        required:[true, "没有文章标题" ]
    },author:{
        type : mongoose.Schema.Types.ObjectId,//od
        ref: "User",//关联连个数据库,数据库的名字一定要写对!!!
        required:[true, "没有作者" ]
    },publishDate:{
        type : Date,
        required:[true,"没有时间"]
    },cover : {
        type :String,
        default :"/home/images/logo.png"
    },content:{
        type: String
    },view:{
        type :Number,
        default : 0
    }
}) 
const Article = mongoose.model("Article",articalSchema);//建立构造函数,第一个传入的参数将作为这个数据库集合的名字
 module.exports={Article}//暴露项目

文章新增

文章有封面,所以需要对文件进行处理

//文章请求
//引入第三方模块
const formidable = require("formidable")
const path = require("path");
const fs = require('fs');
const {Article}=require("../../model/artical")//文章集合构造函数
module.exports=async function(req,res,next){
    //建立表单解释对象
    const form = new formidable.IncomingForm();
    //配置服务器文件夹,将客户端上传的文件保存到这里这里必须写绝对路径 __dirname 是这个文件的文件夹
   form.uploadDir = path.join(__dirname,"../","../","public/","upload")
   //解系表单
   form.keepExtensions = true;
   form.parse(req,async function (err,fields,files){//错误对象 正常信息 文件信息
       fs.rename(path.normalize(files.cover.filepath),path.normalize(files.cover.filepath)+path.parse(files.cover.originalFilename).ext,(error)=>{if(error) {console.log(error)}})
       //由于保留文件后缀的操作蜜汁失灵,只能使用传统方法更改名字
     //res.send((path.normalize(files.cover.filepath)+path.parse(files.cover.originalFilename).ext).split("public")[1])
     let thepath;
     if(path.parse(files.cover.originalFilename).ext===""){
        thepath="/home/images/logo.png";
     }else{
        thepath= (path.normalize(files.cover.filepath)+path.parse(files.cover.originalFilename).ext).split("public")[1];
     }
      await Article.create({
        title :fields.title,
        author :fields.author,
        publishDate :fields.publishDate,
        content :fields.content,
        cover: thepath
      })
      if(err){return console.log(err)}
      res.redirect("/users/article")//重定向  
   })
}

文章修改

和前面的代码基本一致

const formidable = require("formidable")
const path = require("path");
const fs = require('fs');
const {Article}=require("../../model/artical")//文章集合构造函数
module.exports=async function(req,res,next){
    //建立表单解释对象
    const {id} = req.query;
    const form = new formidable.IncomingForm();
    //配置服务器文件夹,将客户端上传的文件保存到这里这里必须写绝对路径 __dirname 是这个文件的文件夹
   form.uploadDir = path.join(__dirname,"../","../","public/","upload")
   //解系表单
   form.keepExtensions = true;
   form.parse(req,async function (err,fields,files){//错误对象 正常信息 文件信息
       fs.rename(path.normalize(files.cover.filepath),path.normalize(files.cover.filepath)+path.parse(files.cover.originalFilename).ext,(error)=>{if(error) {console.log(error)}})
       //由于保留文件后缀的操作蜜汁失灵,只能使用传统方法更改名字
     //res.send((path.normalize(files.cover.filepath)+path.parse(files.cover.originalFilename).ext).split("public")[1])
     let thepath;
     if(path.parse(files.cover.originalFilename).ext===""){
        thepath="/home/images/logo.png";
     }else{
        thepath= (path.normalize(files.cover.filepath)+path.parse(files.cover.originalFilename).ext).split("public")[1];
     }
      await Article.updateOne({_id:id},{
        title :fields.title,
        author :fields.author,
        publishDate :fields.publishDate,
        content :fields.content,
        cover: thepath
      })
      if(err){return console.log(err)}
      res.redirect("/users/article")//重定向  
   })
}

文章展示

向用户展示所有文章,管理员可以看见所有文章,用户只能看见自己的文章

//文章集合的查询
const {Article}=require("../../model/artical")
const pagenation = require("mongoose-sex-page")
module.exports=async function(req,res,next){
    req.app.locals.current="art";//标记,让标签可以高亮
    //查询所有文章数据
    //let articles = await Article.find({}).populate("author").lean();//这个项目关联了其他的数据库集合,所以可以使用这个方法进行多集和联合查询
    let select;
    if(req.app.locals.userInfo.role==="admin"){
        select={};
    }else{
        select={author  : req.app.locals.userInfo._id }
    }
    const {page} = req.query;
    let articles = await pagenation (Article).find(select).page(page).size(10).display(6).populate("author").exec(); 
    articles = JSON.stringify(articles);//不转化的话会报错,使用这种转换方法解决了报错问题,但是不知道为什么
    articles = JSON.parse(articles);
    res.render("users/article",{articles:articles});
}

文章删除

//文章删除
const {Article}=require("../../model/artical")//文章集合构造函数
const {Comment} = require("../../model/comment")
const {Good}=require("../../model/good")
module.exports=async function(req,res,next){
    Comment.remove({aid : req.query.id },(err)=>{if(err)console.log(err)})//文章的所有评论
    Good.remove({aid : req.query.id },(err)=>{if(err)console.log(err)})//文章的所有点赞
    await Article.findOneAndDelete({_id:req.query.id});
    res.redirect("/users/article");
}

主页逻辑

主页路由比较简单

var express = require('express');//引入express
var router = express.Router();//建立理由器
//博客的首页路由
/* GET home page. */
router.get('/', require("./home/index"));//主页
router.get('/article',require("./home/article-render"))//文章
router.post("/good",require("./home/good"))//点赞
router.post("/comment",require("./home/comment"))//评论
module.exports = router;
//暴露路由模块

首页显示

首页显示所有文章,使用了上面已经使用过的分页工具mongoose-sex-page

const {Article}=require("../../model/artical");//文章集合构造函数
//显示所有文章的界面
const pagination = require("mongoose-sex-page")
module.exports =async function(req,res,next){
    const {page} = req.query
    let result = await pagination(Article).find({}).page(page).size(4).display(3).populate("author").exec();
    result = JSON.stringify(result);//使用这种转换方法解决了报错问题,但是不知道为什么
    result = JSON.parse(result);
    res.render("home/default",{result:result})
}

文章显示

通过读取查询字符串的信息确定文章并查找

const {Article} = require("../../model/artical")
const {Comment} = require("../../model/comment")
const {Good}=require("../../model/good")
module.exports =async function(req,res,next){
    const {id} = req.query;
    const article = await Article.findOne({_id:id}).populate("author").lean();//文章
    await Article.updateOne({_id:id},{view : article.view+1})//更新浏览量
    const comments = await Comment.find({aid:id}).populate("uid").lean();//评论
    const goods = await Good.countDocuments({aid:id});//评论
    let gooded = false;
    if( req.app.locals.userInfo){
        const find= await Good.countDocuments({aid:id , uid :req.app.locals.userInfo._id})
        if(find===1){
             gooded=true;
        }
    }
    //res.send(id);
    res.render("home/article.art",{article ,comments,goods,gooded})
}   

评论/点赞

评论点赞的代码基本一致,只是评论有内容,点赞没内容
构建集合

const {Schema, default: mongoose , model } = require("mongoose")
const commentSchema=s=new Schema({
    aid:{//文章id
        type : mongoose.Schema.Types.ObjectId,
        ref : "Article"//链接集合
    },uid:{//用户id
        type : mongoose.Schema.Types.ObjectId,
        ref: "User"
    },content:{//时间
        type:String
    },time:{//内容
        type : Date
    }
});
const Comment = model("Comment",commentSchema);
module.exports={
    Comment
}

添加评论

const{Comment}=require("../../model/comment")
module.exports = async function(req,res,next){
      const {content , aid ,uid} = req.body;
      await Comment.create({
           content : content,
           uid :uid,
           aid :aid,
           time:new Date()
      })
      res.redirect("/article?id="+aid);
}

总结

这是一个非常简单的网站,只是实现了简单的增 删 改 查
所有项目文件请访问我的github项目,包括所有的前后端逻辑:传送门

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

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

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

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值