当前位置: 首页 > Web前端 > HTML

多人博客管理项目总结

时间:2023-03-28 18:30:50 HTML

gitee百度网盘提取码:b2etBLOG--源码目录└──config--配置文件├──development.json--开发环境配置├──default.json--默认配置├──production.json--production环境配置└──custom-environment-variables.json--私有环境变量└──中间件中间件└──loginGuard.js登录拦截└──模型--数据库操作├──connect.js--数据库连接├──comment.js--评论收集规则└──user.js--用户管理└──public--静态资源├──home--blog展示页面└──admin--blog管理页面└──common.js--客户端认证登录表单└──uploads--上传文件└──route--路由└──admin--博客管理页面├──article.js--文章列表页面├──article-add.js--newarticle├──article-edit.js--article管理页面├──loginPage.js登录页面渲染├──logout.js退出页面功能实现├──userPage.js用户页面渲染ing├──user-edit-fn.js--用户添加页面路由├──user-edit.js--用户编辑页面路由├──user-delete.js--用户分页功能路由├──user-modify.js--用户修改功能路由└──login.js登录页面功能实现└──home----博客展示页面├──article.js博文├──index.js--首页文章详情路由├──article.js--文章展示页面路由└──comment.js博客评论├──admin.js--博客管理页面路由└──home.js--博客展示页面路由└──views--Template└──home--博客展示页面美工模板└──common--普通美工模板├──layout.art--公共骨架└──header.art--头部公共部分├──article.art--文章展示└──default.art--文章主页详情└──admin--博客管理页面美术模板└──common--publicpartarttemplate├──header--headpublictemplate├──aside--sidebarpublictemplate└──layout--skeletonpublictemplate├──login.art--loginpage├──error.art--错误页面├──article-edit.art--文章管理模板├──article.art--文章列表模板├──user.art--用户列表页面└──user-edit.art--用户编辑页面├──app.js--创建网站服务├──joi.js--规则描述语言和验证器JavaScriptobjects└──hash.js--bcrypt测试代码技术要点:expressmongoosebcryptJoiart-templateexpress-art-templateexpress-sessionmongoose-sex-pagemorganconfig(一)路由跳转及代码公共部分提取主要内容:初始化项目:创建网站服务器,搭建模块化路由,引入路由模块,搭建博客管理页面模板路由匹配请求路径:导入路径,打开静态资源文件,渲染模板后缀为art优化模板(提取公共部分),构建骨架模板(二)项目功能实现-用户管理主要内容:连接数据库,创建用户集合,初始化用户为登录表单项设置请求地址、请求方法、表单项名称属性。当用户点击登录按钮时,客户端会验证用户是否填写了登录表单。如果其中一项未输入,则阻止提交表单。服务器接收请求参数并验证用户。登录表单是否填写,如果其中一项没有填写,则响应客户端,阻止程序向下执行,根据邮箱查询用户信息,如果用户不存在,则响应客户端,并防止程序向下执行,如果用户存在,则比较用户名和密码。如果比较成功,则用户登录成功。如果比对失败,则用户登录失败保存登录状态和密码加密。列表页新建用户按钮添加连接对应添加路由的链接,在路由处理函数中渲染新建用户模板。为新建的用户表单指定请求地址和请求方式,并在表单项中添加name属性。添加添加用户功能路由接收客户端传过来的请求参数。验证请求参数的格式。验证当前要注册的邮箱地址是否已经注册。加密密码。将用户信息添加到数据库中。将页面重定向到用户列表页面(4)实现项目功能数据分页当前页,用户点击上一页或下一页或页码生成,客户端将总页码传给服务端通过get参数方法,根据总页数判断当前页是否为最后一页,根据判断结果进行响应操作,总页数:Math.ceil(数据项总数/个数每页显示的数据项数)(5)项目功能实现用户信息修改将需要修改的用户ID传给服务端创建用户信息修改功能对应的路由接收客户端表单传过来的请求参数根据id查询用户信息,并将客户端传过来的密码与数据库中的密码进行比对。如果比对失败,则响应客户端。如果密码比对成功,则将用户信息更新到数据库中。(6)项目功能的实现:用户信息删除在确认删除框中添加一个隐藏字段,用于存储待删除用户的ID值在删除按钮中添加一个自定义属性,用于存储删除的ID值在删除按钮的点击事件中添加用户,在点击事件处理函数中获取自定义属性存储ID值,将ID值存储在表单的隐藏字段中。在删除表单中添加提交地址和提交方式。在服务器端建立删除功能。接收客户端传过来的id参数。根据id删除用户(7)项目功能文章管理的实现(8)另一种分页方式:mongoose-sex-page(第三方模块)(9)添加账户到mongoDB数据库实现项目功能(10)项目功能实现的开发环境和生产环境(11))博客系统的前台展示页面(12)项目功能的实现:文章评论和退出功能