基于vue+express+node+mysql等技术搭建的企业整站

该系统为建设一个高可扩展的H5企业网站,主要功能模块图如下:


基于vue+express+node+mysql等技术搭建的企业整站_第1张图片

该系统分为前台用户子系统和后台企业管理子系统,具体系统用例图如下:


基于vue+express+node+mysql等技术搭建的企业整站_第2张图片
基于vue+express+node+mysql等技术搭建的企业整站_第3张图片

根据功能性需求,使用starUML建立数据库E-R图如下:


基于vue+express+node+mysql等技术搭建的企业整站_第4张图片

本系统需要安装通过`install express cookie cookie-session body-parser mysql express-static express-route multer consolidate ejs -D`来安装模块依赖。

后台管理登录页 采用md5加密,主要功能代码为:

const crypto=require('crypto');

module.exports={ MD5_SUFFIX: '(一段随意的字符串)', md5: function (str){ var obj=crypto.createHash('md5');

obj.update(str);

return obj.digest('hex'); } };

验证登录:

const express=require('express');

const common=require('../../libs/common');

const mysql=require('mysql');

var db=mysql.createPool({host: 'localhost', user: 'root', password: 'root', database: 'web'});

module.exports=function (){

var router=express.Router();

router.get('/', (req, res)=>{ res.render('admin/login.ejs', {});

});

router.post('/', (req, res)=>{ var username=req.body.username;

var password=common.md5(req.body.password+common.MD5_SUFFIX);

db.query(SELECT * FROM admin_table WHERE username='${username}', (err, data)=>{ if(err){ console.error(err); res.status(500).send('database error').end();

}else{ if(data.length==0){ res.status(400).send('no this admin').end();

}else{ if(data[0].password==password){ //成功 req.session['admin_id']=data[0].ID;

res.redirect('/admin/');

}else{ res.status(400).send('this password is incorrect').end();

} } } });

});

return router;

};

登录页面效果图如下:


基于vue+express+node+mysql等技术搭建的企业整站_第5张图片

后台管理首页:


基于vue+express+node+mysql等技术搭建的企业整站_第6张图片
基于vue+express+node+mysql等技术搭建的企业整站_第7张图片

增删改操作:


基于vue+express+node+mysql等技术搭建的企业整站_第8张图片
基于vue+express+node+mysql等技术搭建的企业整站_第9张图片
基于vue+express+node+mysql等技术搭建的企业整站_第10张图片

前台首页:


基于vue+express+node+mysql等技术搭建的企业整站_第11张图片

服务项目及客户案例展示页:


基于vue+express+node+mysql等技术搭建的企业整站_第12张图片
基于vue+express+node+mysql等技术搭建的企业整站_第13张图片

新闻展示页:


基于vue+express+node+mysql等技术搭建的企业整站_第14张图片

新闻详情:


基于vue+express+node+mysql等技术搭建的企业整站_第15张图片

关于我们:


基于vue+express+node+mysql等技术搭建的企业整站_第16张图片

前台注册登陆页与企业主页:


基于vue+express+node+mysql等技术搭建的企业整站_第17张图片

项目地址:https://github.com/xuguangwen/nodeStation 

个人github博客:www.xiaoxiaojuzi.cn

如有问题欢迎咨询,如果喜欢请留下您的star

你可能感兴趣的:(基于vue+express+node+mysql等技术搭建的企业整站)