摘要：项目功能实现路由接口书写和前台页面的显示安装这里就不详细说了，官网上面有步骤，主要来看里面的路由设置，如图这里做了几个改动我说下我的理解，如有不对，希望指出。
用express实现一个后台管理系统 github地址，欢迎star，有错误的欢迎指出。 前言
近期学习express，于是想着用express写个东西加深印象，巩固下学到的知识。于是就有了这个个人项目。
前端部分bootstrap布局，jquery,js实现功能
后段部分express框架搭建服务，写路由接口。
mysql 进行数据的增删改差。
项目概览先看一波实现图吧。
1,安装express这里就不详细说了，express官网上面有步骤，主要来看app.js里面的路由设置，如图,
这里做了几个改动,我说下我的理解，如有不对，希望指出。app.js作为入口文件，看图上的箭头，当请求的路径为news的时候，也就是app.use("/news",index)这行代码，他会去找router文件下面的index文件然后执行，也就是require("../routers/index")这行代码。
2,看index文件下面的代码，如图
这里通过前台传的newstype（新闻类型的值）和pagenumber（显示的条数）,然后在数据库里面查找和传回来的newstype匹配的数据并限制显示3条，并返回给前台数据,前台代码如下图(原谅我截图截不完全)，
之后得到数据进行遍历显示就可以了。
3，实现加载更多的功能，在上图中看，只需要给定一个初始值pagenumber,然后点击加载更多的按钮进行加3就可以了。
1.主要是得到用户输入值，然后点击通过点击按钮的时候发送请求，先看express 的路由接口设置。如图，
这里说明下，到了后台管理页面，往app.js里面看，这里就要执行这2段代码了，
app.use("/admin",users)
var users = require(../routes/users)
这里就要去找routes文件夹下面的users文件并执行了。
2.这里用了node 的xss防御的插件，用法比较简单，npm 安装,然后引入。
var xss = require("xss");
之后对用户的输入校验,这里值针对xss存储型攻击,如
var newstitle = xss(req.body.newstitle);
3.除此之外，还做了csufr 跨站攻击的处理，这里我说下我的理解。首先，需要在html里面插入一个隐藏的input标签,
这里需要注意的是name值必须为_csrf,这个Input标签的作用就相当于自身带了一个令牌（身份证）。
然后，在用户输入的时候也要获取到这个input的值，并一起发给后台，如图，
接着，在express里面需要npm安装csurf插件并引入,如图
最后，在一进来后台管理路由的做判断是否和携带的令牌相匹配。
router.get("/", csrfProtection, function(req, res) {res.render("users", { csrfToken: req.csrfToken()})
})
3.分页的显示,其实和加载更多的类似，先获取到当前页数，然后设定每页显示多少条，最后把这2个值传给后台，后台mysql进行操作。我这里偷懒没做计算，准确的应该是拿到数据库的数据条数，然后除以每页要显示的条数，在总数除以这个数就得到页数。
总结通过这个个人项目，算是对express有点了解，加深了自己对ajax的使用和感悟，也接着学习了web安全防御，主要分为存储型和反射型，反射型一般是对url进行攻击，存储型一般对用户的输入做攻击.
文章版权归作者所有，未经允许请勿转载,若此文章存在违规行为，您可以联系管理员删除。
转载请注明本文地址：https://www.ucloud.cn/yun/47192.html
摘要：经过这一段时间对的学习，于是萌生了要开发一个个人博客的想法，经过差不多半个月断断续续的开发，也算是让项目有了能上线的样子，休息了一阵子，今天就来把我这个新人的第一个上线项目分享出来吧，有很多地方自觉写得不好，希望多多拍砖。 经过这一段时间对Vue的学习，于是萌生了要开发一个个人博客的想法，经过差不多半个月断断续续的开发，也算是让项目有了能上线的样子，休息了一阵子，今天就来把我这个新人的...
摘要：注册成功后会返回注册用户的此就是上面说到的，用于用户登陆的基础，请保管好。 地址 https://github.com/billyhoomm...http://blog.billyhu.com 说明（Instructions） 本项目后台基于express、mongodb，前台基于Vue2.0全家桶、bootstrap、scss预编译器以及一众工具类插件 项目前后台代码在同一个目录中...
摘要：注册成功后会返回注册用户的此就是上面说到的，用于用户登陆的基础，请保管好。 地址 https://github.com/billyhoomm...http://blog.billyhu.com 说明（Instructions） 本项目后台基于express、mongodb，前台基于Vue2.0全家桶、bootstrap、scss预编译器以及一众工具类插件 项目前后台代码在同一个目录中...
摘要：注册成功后会返回注册用户的此就是上面说到的，用于用户登陆的基础，请保管好。 地址 https://github.com/billyhoomm...http://blog.billyhu.com 说明（Instructions） 本项目后台基于express、mongodb，前台基于Vue2.0全家桶、bootstrap、scss预编译器以及一众工具类插件 项目前后台代码在同一个目录中...
摘要：本使用创建本地服务器，在就能完成全部流程，并不需要线上服务器。路径要与后端接口一致。后端返回成功后，前端数据中对应的元素也要删掉，更新视图。控制器里拿一个方法出来说一下吧，完整的代码都在。读取操作完成后调用释放连接。 写在前面 本文只是本人学习过程的一个记录，并不是什么非常严谨的教程，希望和大家一起共同进步。也希望大家能指出我的问题。适合有一定基础，志在全栈的前端初学者学习，从点击按钮...
阅读 2885·2021-10-14 09:43
阅读 3046·2021-09-30 09:47
阅读 614·2021-08-17 10:11
阅读 1492·2019-08-30 11:15
阅读 889·2019-08-26 13:54
阅读 3403·2019-08-26 11:47
阅读 1066·2019-08-26 10:20
阅读 2705·2019-08-23 18:35
