基于Node.js多人博客系统的设计与实现

来源:用户上传      作者:李嘉明

　　摘要：基于Node.js平台，开发一套风格简约、性能优异的多人博客系统。前端技术栈为Vue.j s+vue-router+iView，后端技术栈为Koa.js+sequlize+mysql，富文本编辑器采用与Vue深度集成的mavon-editor，路由的切换由vue-router完成，是典型的SPA（ single page application）。功能模块包括用户、文章、分类搜索三大模块，用户分为访客、博主、管理员，不同身份的用户对文章具有不同的操作权限，分类搜索模块有助于用户精准地查询感兴趣的文章，节省用户搜索知识的时间。
　　关键词：Node.js;Vue.js;Koa.js;mavon-editor;SPA;分类
　　中图分类号：TP311 文献标识码：A
　　文章编号：1009-3044（2020）09-0071-02
　　1 背景
　　随着知识经济时代的到来，知识已经日渐成为个人、企业、国家发展的核心力量[1]。互联网烦琐冗余的知识碎片难免令人感到晕眩和焦虑[2]，这是对知识缺乏筛选造成的，缺乏一个快捷方便的工具，去收集整理某领域实用的知识或经验。同时，一部分人渴望能有一个平台记录、分享学习或工作中的知识[7]，博客系统应运而生。然而，国内外众多博客系统较为臃肿，充斥着许多与文章主题无关的元素。人们对功能和效率的追求逐渐提高，对网络博客的文章也是如此[8]，为用户打造简约、高性能的博客系统具有重要意义。本文基于Node.js开发了一套风格简约的多人博客系统，旨在为用户提供精简记录、分享知识的平台，并且通过细粒度的标签分类和关键字搜索，用户能够快速、精准地获取到感兴趣的知识，节省用户的时间。
　　2 技术选型
　　2.1 Node.js
　　Node.js是一个基于Chrome V8引擎的JavaScript运行时环境，被设计用来构建可伸缩的网络应用程序。Node.js使用事件驱动、非阻塞1/0模型而得以轻量和高效，非常适合在分布式设备上运行数据密集型的实时应用。npm （Node package manag-er）是Node.js的包管理器，解决了Node.js平台上代码部署的诸多问题，通过npm命令可以方便地下载、安装、卸载、升级、查询第三方软件包。在Node.js平台上开发Web应用，还能统一前后端开发的编程语言，减少开发者的学习成本。
　　2.2 Vue.js
　　Vue.js，简称vue，是一套专注于构建用户界面的渐进式Ja-vascript框架，具有高性能、灵活性强的特点[6]。vue遵循渐进增量的设计原则，使其可以方便地集成到现有的项目中，这一特性使得vue既可以快速构建出較小的原型，也可以构建出复杂的大型web应用。作为vue的核心功能之一，响应式的数据系统，能通过轻量式的虚拟DOM引擎，自动、高效更新用户界面，避免以往命令式操作DOM所带来的弊端，简化前端开发的流程和开发效率，同时大大提高了系统后期的可维护性。
　　2.3 Koa.js
　　后台框架选用Koa.js，Koa.js是基于Node.js平台的下一代web开发框架，致力于成为一个更小、更富有表现力、更健壮的web框架。使用koa编写web应用，可以避免烦琐的回调函数嵌套，并极大地提升错误处理的效率。
　　3 系统设计
　　本系统含有用户、文章、分类搜索等3大功能模块。
　　1）用户模块：访问本系统的用户具有3种身份，分别是访客、博主、管理员。其中，访客是指没有在该系统注册过的用户，访客进入系统后，对网站内的文章仅有浏览权限，能够正常使用分类搜索功能检索文章。博主是指使用注册过的账号登录本系统，注册账号时需要输入用户名、密码以及有效的邮箱，三者均为必填项，博主除了能浏览所有文章之外，还具备新增文章、对文章进行点赞的功能。管理员具有最高权限，除了具备博主的所有功能外，还能发出公告、对分类标签进行管理。
　　2）文章模块：文章模块主要用于对执行文章的增删改查操作，一篇文章所具有的属性有id、标题、标题、作者、简介、封面、内容、浏览数、点赞数、分类标签。其中封面指的是显示在主页文章列表中的图片，用于增强文章吸引力，浏览数和点赞数用于甄别文章质量的高低，同一用户对同一篇文章只能点赞一次，访客不具备点赞功能，分类标签是给文章指定一个类别。新增文章时，文章作者自动成为博主的用户名，无法更改，文章标题、简介、内容是必填项，分类标签是必选项，均不能为空。博主只能对自己发表的文章进行修改和删除，而不能修改或删除其他博主的文章。
　　3）分类搜索模块：分类搜索模块可进一步拆分为分类标签子模块和关键字搜索子模块。其中，分类标签子模块是将文章分门别类的一个指标，在每篇文章生成时，都需要选定有且仅有一个的分类标签，用于将这篇文章归属到某个领域，方便对该领域感兴趣的用户可以快速查询到相关的文章。关键字搜索子模块是在搜索框中输入文章的关键字，后端获取到该关键字后，在数据库中执行模糊查询，标题含有相应关键字的文章会从数据库中取出，然后将这些文章渲染到首页的文章列表。分类标签和关键字搜索两个子模块可同时生效，即同时满足两个条件的文章才会呈现在用户面前，因此提供了一种更精确的搜索方法，为用户查找节省时间。
　　4 核心模块实现
　　4.1 富文本编辑器
　　富文本编辑器（Rich Text Editor）是一种可内嵌于浏览器，所见即所得的文本编辑器，提供了类似于Office Word的编辑功能，用户不需要掌握HTML语法，也能轻松地在网页中编辑自己的文章。本系统选用基于Vue的mavon-editor富文本编辑器，引入mavon-editor后，界面主体分为左右两部分，左边是支持markdown语法书写的文本内容，右边是对应生成的网页上展示的内容，用户能实时预览书写的内容在网页上实际展现的效果。通过在mavon-editor标签中添加vue指令“v-model”，实现文章内容与vue组件中的数据变量双向绑定，将该变量通过axios存人数据库，实现文章内容的永久存储。除此之外，ma-von-editor还内嵌有许多实用的事件方法，比如点击工具栏中的上传图片时，会自动触发“$imgAdd”方法，开发者通过重写“$imgAdd”方法实现文章内图片的上传。图片上传成功后，由于mavon-editor会记录图片在文章中的位置信息，开发者只需专注于获取正确的图片url，无需操心如何将图片放置在文章对应的地方，mavon-editor会在插入图片的位置自动生成图片的url等信息。 　　4.2 路由模块
　　路由就是根据不同的url地址展示不同的内容或页面。传统的Web应用，页面的切换是通过向后端发送http请求，后端路由处理http请求后跳转到新的页面，此过程会刷新浏览器页面，造成重复请求不同页面中相同的静态资源的现象，在用户并发量大或是网络延迟大的场合，用户体验差。而在SPA应用中，页面的切换是通过前端路由来实现，渲染新页面的动态数据由前端向后端发送aJax请求获得，此过程并不会刷新浏览器页面。这也是单页应用的核心：更新视图而不重新请求页面，加载页面时只更新某个指定的容器中的内容。在SPA应用中，用户所有的操作都是在同一个页面中完成，共享资源只需要请求一次即可，用户体验较好。
　　vue-router是与vue.js深度集成的路由插件，用于设定访问路径，并将路径和组件映射起来。传统的页面应用，是使用超链接来实现页面的切换和跳转的，而vue-router在SPA应用中，负责路径的切换，也就是组件的切换。结合HTML5中新增的API（Application Programming Interface），可以实现在不刷新页面的情况下，动态改变页面的URL，减少http请求，提高用户体验。对于使用vue-cli4脚手架生成的vue项目，路由的配置在根目录下的router/index.js中完成，指定不同路径所对应的组件，实现全局路由的跳转配置。可在每一项中添加meta属性，用于保存每个路径携带的额外信息，比如切换到该路径时是否需要校验用户权限、将浏览器标题为meta中指定的字符串等。此外，还能通过路由钩子函数beforeEach在跳转到对应页面之前进行拦截，判断当前用户是否可以访问该页面，如果权限不够，则不展示该路径的内容，并重新定位到另一页面，提示用户无访问权限。
　　4.3 对象关系映射
　　ORM（ Object-Relational Mapping）框架，其作用在于把關系型数据库的表结构映射到对象上，是对soL语句的封装，通过读写JavaScript对象的方式操作数据库，优雅地生成安全、可维护的soL代码。Sequelize是一款基于Node.js功能强大的异步ORM框架，同时支持PostgreSQL、MySQL，SQLite、MssoL等多种数据库，非常适合作为nodejs后端数据库的存储接口，避免直接操作烦琐的SQL语句，提高了开发效率。
　　5 结束语
　　本文主要从相关技术、系统设计、核心模块实现这三个方面，详细地阐述了基于Node.js平台多人博客系统的开发设计工作。本系统是典型的SPA，当页面切换时，浏览器无须刷新页面请求相同的静态资源，大大提升了用户体验，为用户提供了快速便捷的归纳、整理知识的工具，同时也为不同的用户架起了分享知识、经验的桥梁。
　　参考文献：
　　[1]黄宜修.软件公司知识分享系统的设计与实现[D].杭州：浙江大学，2011.
　　[2]柳艳，马毓联，马禹晨，等，知识分享平台盈利模式研究——以某App为例【Jl.营销界，2019（42）： 61，63.
　　[3]钱磊，宁少淳.基于知识共享协议的数字作品分享平台设计与实现【Jl.软件导刊，2017，16（9）： 126-129.
　　[4]柳志强，陕粉丽.基于NodejS的聊天系统的设计与实现[Jl.电脑知识与技术，2017，13（13）： 69-70.
　　[5]何锡浩，单玉刚.基于nodejs的校园智能视频监控系统设计和实现[J].电脑知识与技术，2019，15（36）： 198-200.
　　[6]吕英华.渐进式JavaScript框架Vue.js的全家桶应用[J].电子技术与软件工程，2019（22）： 39-40.
　　[7]罗路腾，王贵鑫.基于Springboot的博客网站的设计与实现[J].科学技术创新，2019（33）： 64-66.
　　[8]邹竞莹.Node.JS博客系统的设计与实现[D].哈尔滨：黑龙江大学，2016.
　　[9]王璐，崔保磊，潘红霞，等.基于Vue.js的在线设计开放平台研究与实现[J].信息技术与信息化，2019（11）： 168-170.
　　【通联编辑：谢媛媛】
　　作者简介：李嘉明（1993-），男，广东梅州人，助教，硕士，主要研究方向为物联网、软件工程。
转载注明来源:https://www.xzbu.com/8/view-15209585.htm