摘 要

随着计算机技术的成熟,互联网的建立,如今,PC平台上有许多关于文章管理方面的应用程序,但由于使用时间和地点上的限制,用户在使用上存在着种种不方便,而开发一款基于微信小程序的文章管理系统,能够有效地解决这个问题。

本基于微信小程序的文章管理系统是针对文章管理而开发,采用微信开发者工具进行微信端开发,使用MYSQL数据库进行系统数据的储存,系统满足用户通过微信客户端进行文章管理的需求。本小程序是以微信为入口的,可以说是在自带接近10亿的流量人口。整个系统不仅操作简单、便捷,而且节约用户的时间及资源成本等,仅需通过一部手机和微信号即可满足用户们的需求。

论文首先阐述了基于微信小程序的文章管理系统的开发背景,并对开发基于微信小程序的文章管理系统所采用的相关技术进行了详细的介绍,然后对此应用软件进行了需求分析、设计,最后对系统进行测试、维护,保证系统的正常运行。

关键词:微信小程序 ;微信开发者工具;文章管理;MYSQL数据库

第1章  绪论

1.1研究背景

二十一世纪是一个集数字化,网络化,信息化的,以网络为核心的社会。随着互联网的发展,传统生活变得更加方便快捷,许多事物都可以跟互联网相连接,于是就提出了“互联网+”[1]的概念,日常生活离不开计算机更离不开互联网,例如生活中最平常的衣食住行,都有其相关的智能产品,所以科技改变生活,传统的生活方式面对互联网的新浪潮的冲击,已经渐渐退出了历史舞台,相信未来的某一时刻,传统的生活方式将进入全智能化的阶段。

在信息技术迅速发展的今天,计算机技术已经遍及全球,使社会发生了巨大的变革,现今各类智能手机不断更新,智能手机的普遍使用让各种基于手机移动端的APP问世,其中,微信已是时下国内最火的聊天交流APP,备受人们青睐,近年来,微信发展规模越来越大,越来越多的人开始使用微信,目前智能手机系统的普及,人们手机上基本都有了微信,根据去年公布的一组数据中可知,微信去年最高用户量达到10亿多;而建立在微信平台基础上的小程序凭着它不用安装、不占内存、使用便捷、用完即走等众多优点[2],小程序借着微信平台快速成长,也为各行业的发展带来了极大的便利,这使得基于微信小程序的系统应运而生,为用户提供便利。

基于以上微信的发展,结合目前文章管理方面的需求,开发了本基于微信小程序的文章管理系统,满足了不同用户的功能需求,包括用户、作者和管理员,实现文章管理的重要功能,提高文章管理效率。

1.2设计原则

在开始开发项目之前,必须要先考虑项目的实用性、科学性,以及该项目是否能够真正让用户受益并尽可能的发挥项目的作用。因此,在开发前,通过以下几条原则对项目进行判断:

(1)可行性原则。项目需要保证经济可行性和技术可行性,这包括了项目在浏览端、服务端等方面上的经济和技术上是可以达成的。

(2)适应性原则。项目要保证可维护性和可扩展性,这是每个非短期项目都需要考虑的,并且不论是维护还是扩展,都必须要建立在适应用户的正常需求的基础上。

(3)安全性及保密性原则。要充分保证用户信息的安全性和保密性,不能因为开发上的疏忽,导致用户的信息泄露。

(4)系统工程原则。为了确保项目的整体性,在项目调查、项目分析、项目设计、项目开发的过程中,都需遵从项目工程的方法和步骤逐步进行。

(5)统一规划、分期实施、逐步完善原则。项目开发的过程中,要按照规划、分期实施,特别是要注意在项目开发过程中要有条理,从点到面,一步步完善,不要贪图进度,要循环渐进的对项目进行开发。

1.3论文组织结构

本基于微信小程序的文章管理系统在开发技术的选择上,使用WXML 、WXS、JS小程序编写语言和MYSQL数据库开发。本论文的组织结构如下:

第1章绪论。阐述论文工作的研究背景和设计原则。

第2章系统关键技术介绍。介绍构建基于微信小程序的文章管理系统进的相关技术。

第3章系统分析。分析基于微信小程序的文章管理系统的需求,包括系统性能分析、系统功能分析以及系统流程分析等。

第4章系统设计。根据需求分析对系统进行功能模块划分和数据库设计,并构建系统结构图以及数据库E-R图等。

第5章系统的实现。对系统主要功能模块进行界面展示。

第6章系统测试。对系统进行测试工作,发现系统bug,进行修改,确保系统正常稳定的运行。

第7章结论。总结论文的主要工作,提出进一步完善基于微信小程序的文章管理系统的目标和明确方向。

第2章  关键技术简介

2.1 微信小程序

微信小程序,简称小程序,英文名Mini Program,是一种全新的连接用户与服务的方式,可以快速访问、快速传播,并具有良好的使用体验[12]。

小程序的主要开发语言是JavaScript,它与普通web的开发有很多相似之处。小程序和普通网页开发并不是相同的东西,是有差异的。网页开发的渲染线程和脚本线程是互斥的,而在小程序中,确实分开的,分别在不同的线程之中运行。网页开发的工作者可以运用各种浏览器暴露出来的DOM API,进行DOM选中和操作,但小程序不行,它并没有一个完整的浏览器对象,因此缺失DOM API和BOM API。这样的差别使得前端开发中经常用到的一些库是无法在小程序中运行的。另外,网页开发的工作者在开发网页时所要面对的环境是在各式各样系统上运行的各式各样的浏览器,,而小程序只,只需面对iOS和Android这两道操作系统下的微信就足够了。

小程序和传统的APP相比,有着开发成本更低,获客成本更低,开发周期更短,发展空间更大等的优点。不过,为了体现“用完即走”、“无需安装”等理念,小程序的功能、性能还有大小都受到了制约,可以说是各有利弊。

2.2 微信开发者工具

为了能够让微信小程序的开发人员有根家优秀的开发环境,腾讯在原有的公众号网页调试工具的基础上,推出了全新的微信web开发者工具。

微信web开发者工具具备编辑、调试、项目、编译、关闭、后台和缓存这七个选项卡,让开发者能够更方便的进行开发和调试,节省开发所耗费的时间。

2.3微信小程序API接口

微信小程序API接口是腾讯公司为了微信小程序和微信公众号提供的接口文档,里面包含了各种需要使用的接口技术[7],例如本项目用到的获取微信用户信息(wx.getUserInfo)、蓝牙通讯传输功能、网络请求(wx.request)、定位功能等,总的来说,小程序API是满足一个程序开发的大部分接口。

2.4 WXML 、WXS、JS小程序编写语言

WXML全称是 WeiXin Markup Language,是微信标记语言,是微信小程序的标签语言,结合小程序的基础组件、事件系统,可以构建出页面的结构。类似于HTML语言,但是他自身也拥有一定的特色。

WXSS(WeiXin Style Sheets)是微信样式表,是微信小程序用于修饰标签语言的样式文件,WXSS 用来决定 WXML 的组件应该怎么显示。为了适应广大的前端开发者,WXSS 具有 CSS 大部分特性,同时为了更适合开发微信小程序,WXSS对CSS语言进行修改和扩充,引入全新尺寸单位rpx,但大体语法于CSS语言不分离。

JS是 JavaScript[4]语言的简称,微信小程序里面也可以叫做WXS,是一门脚本语言,通俗易懂,用于页面交互的语言。

2.5 MYSQL数据库

MySQL 是关系型数据库管理系统的代表,它是属于 Oracle 旗下产品,使用C语言和C++语言编写的,使用了多种技术,由于它体积小,易使用,成本低,灵活性[2],该数据库在中小企业比较受欢迎。MySQL的灵活性体现在非常多方面,可是适应高要求的环境,通过不同配置适应各种硬件,同时支持各种不同的数据。因为MySQL是其免费开源的,而且MySQL的功能已经足够用对于学习和中小型企业来讲,所以开发中小型网站都会选择MySQL作为网站的数据库。[5]

第3章  系统分析

3.1 可行性分析

需要使用大部分精力开发的基于微信小程序的文章管理系统为了充分降低开发风险,特意在开发之前进行可行性分析这个验证系统开发是否可行的步骤。本文就会从技术角度,经济角度,还有操作角度等进行综合阐述。

3.1.1技术可行性

本文章管理系统采用Java技术,基于微信小程序,采用MYSQL数据库进行开发的。

(1)Java提供了稳定的性能、优秀的升级性、更快速的开发、更简便的管理、全新的语言以及服务。整个系统帮用户做了大部分不重要的琐碎的工作。

(2)基于微信小程序的系统的开发已发展日趋成熟。

(3)作为计算机专业的学生,对数据库比较熟悉,掌握了MYSQL数据库,建立这样一个系统应该在能力范围之内

综上所述:基于微信小程序的文章管理系统的开发技术具有很高可行性。

3.1.2 经济可行性

该系统的开发工具使用的都是免费的开发工具,且内容较为简单,一台计算机便可以开发出这个系统,且后期的维护,修改等对本系统的改动,都可以只通过一台计算机实现,因此开发该系统的成本在有计算机的情况下基本为0,所以本系统在经济上是可行的。

3.1.3 操作可行性

本系统操作页面简洁明了,操作极其容易,用户登陆后一眼便可看到自己所需要的信息,而管理员的操作也十分轻松便捷,只要操作人员具有一定的文字水平以及简单的逻辑思维,就可以轻松操作本系统,因此本系统在操作上是可行的。

3.1.4时间可行性

从2020年11月份我们在学校就没有课程了,同学们大部分选择找工作实习了,我也是在其中。一边找工作的同时,一边忙着完成毕业设计工作。对于我本人来讲,目前的情况是白天我要上班参加实习工作,只有晚上我才有时间完成论文编写工作。论文答辩是在2021年5月份左右,将近半年时间来完成毕业设计,时间上还是很充分。

综上可以看出,本基于微信小程序的文章管理系统的开发在技术、经济、操作以及时间四个方面都具有很高的可行性,开发本程序可行。

3.2 系统性能分析

随着互联网的发展,微信小程序越来越完善,现在的生活中充斥着微信小程序,由于小程序方便快捷,基于微信这个大平台,小程序发展是高速的,吃饭可以通过小程序点餐,出去玩可以用小程序打车,因此文章管理也可以使用小程序。系统性能需求如下:

(1)软件功能清晰明了,尽量多用列表的展示简化用户操作,提升使用者体验,减少下拉菜单这种降低体验的操作。

(2)软件的功能要尽量完整,也要全面。

(3)经常的在以后版本更新完善软件,使得软件保持一个新鲜度,也可以做一些活动来促进用户使用软件。

(4)减少软件使用过程中出错,做好优化,遵循开发逻辑,降低bug的产生率以提升用户体验。

3.3 系统功能分析

本基于微信小程序的文章管理系统满足了不同用户的功能需求,包括用户、作者以及管理员,下面对这不同用户的功能需求进行简介。

(1)管理员功能分析

管理员可进行后台进行管理,包含个人中心、用户管理、作者管理、文章管理、文章分类管理、论坛以及系统管理。

管理员用例图如图3.1所示。

图 3.1 管理员用例图

(2)作者功能分析

作者注册登录后主要功能模块包括首页、文章、论坛以及我的(文章、我的收藏管理、客服、我要发帖、我的发帖)。

作者用例图如图3.2所示。

图 3.2 作者用例图

(3)用户功能分析

没有账号的用户可进行注册操作,注册登录后主要功能模块包括首页、文章、论坛以及我的(文章、我的收藏管理、客服、我要发帖、我的发帖)。

用户用例图如图3.3所示。

图 3.3 用户用例图

3.4系统界面分析

用户界面指的是用户直接看到的图形界面也称为前端设计。用户界面的好坏直接影响到用户操作时的体验、效率,愉快性,而且用户界面设计不当还会导致无法很好的发挥出系统的性能。

1.界面元素

常见的用户界面都会包括:整体页面的主颜色,字体的大小,字体的颜色,整体页面的布局,主要功能在页面上的布局位置,重要的输入界面和输出界面,人机交互界面。用户界面采用的主颜色,还有整体的布局的美观和功能布局的位置是否符合人性的设计都会直接的影响到用户对本系统软件的认同度。

2.用户角色

界面的设计必须建立在用户的角度,只有把自己当作用户思考人们的使用习惯和爱好的时候,才能开发出一个围绕用户的界面。通过调查用户的操作习惯,并将收集而来的纷乱复杂信息,进行总结,抽象得出满足用户的用户界面模型。

3.需求变化

人们的审美和习惯爱好,总是在不断的改变着。故要根据不同用户的喜好,操作习惯作不同的需求设计分析,作出更加符合的用户口味的操作界面。从而得到用户的认可。

4.界面原型

设计的前期通过快速的创建界面原型,通过同学的建议一点一点的改进用户界面从快速的达到理想的效果。用户界面的设计原则要满足以下几点:

(1)页面简洁,操作简单。

(2)对于用户而言,浏览信息比记忆信息更友好。

(3)从用户的角度思考,才能让用户更好的接纳。

(4)利用当今已经流行的页面设计,让用户快速的学会操作。

5.安全性问题

安全性问题应该是人们最看重的。用户界面上输入的信息不会被别人窃取,还有若输入的时候出现错误页面必须能够回退。

第4章  系统设计

4.1系统结构设计

本基于微信小程序的文章管理系统主要实现了作者功能模块、用户功能模块和管理员功能模块三大部分,系统结构图如图4-1所示。

图4.1系统功能结构图

4.2系统顺序图设计

4.2.1登录模块顺序图

登录模块主要满足了管理员、作者和用户的权限登录,登录模块的顺序图如图 4.2 所示。

图4.2登录顺序图

4.2.2添加信息模块顺序图

管理员、用户以及作者登录后均可进行信息的添加操作,添加信息顺序图如图4.3所示

图4.3添加信息顺序图

4.3系统数据库设计

4.3.1 数据库E-R图设计

系统E-R图就是系统的实体关系图,它是用来描述某一组织(单位)的概念模型,提供了表示实体、属性和联系的方法。构成E-R图的基本要素是实体、属性和关系。实体是指客观存在并可相互区分的事特;属性指指实体所具有的每一个特性。根据数据库中的几个表分别绘制数据库的实体图。以下给出本系统中比较重要的实体E-R图。

(1)文章信息实体E- R图,如图4.4所示

图4.4 文章信息实体属性图

(2)论坛信息实体E- R图,如图4.5所示

图4.5 论坛信息实体属性图

(3)管理员信息实体E- R图,如图4.6所示

图4.6  管理员信息实体属性图

(4)用户信息实体E- R图,如图4.7所示

图4.7 用户信息实体属性图

(5)作者信息实体E- R图,如图4.8所示

图4.8 作者信息实体属性图

(6)文章分类信息实体E- R图,如图4.9所示

图4.9 文章分类信息实体属性图

4.3.2 数据库表设计

本基于微信小程序的文章管理系统在开发过程中使用MySQL数据库系统进行系统数据的储存,以下是本系统的主要数据库表信息。

表4.1  wenzhang文章信息表

序号

字段

描述

类型和长度

主键

是否可空

1

id

编号

bigint(20)

不允许

2

addtime

创建时间

timestamp

允许

3

wenzhangmingcheng

文章名称

varchar(200)

允许

4

leibie

类别

varchar(200)

允许

5

zuozhezhanghao

作者账号

varchar(200)

允许

6

zuozhexingming

作者姓名

varchar(200)

允许

7

fabushijian

发布时间

datetime

允许

8

`fengmian`

封面

varchar(200)

允许

9

`wenzhangneirong`

文章内容

longtext

允许

10

`thumbsupnum

赞数

int(11)

允许

11

crazilynum

踩数

int(11)

允许

12

clicktime

最近点击时间

datetime

允许

13

userid

用户编号

bigint(20)

允许

表4.2  forum`论坛信息表

序号

字段

描述

类型和长度

主键

是否可空

1

id

编号

bigint(20)

不允许

2

addtime

创建时间

timestamp

允许

3

title

帖子标题

varchar(200)

允许

4

`content

帖子内容

longtext

允许

5

`parentid

父节点编号

bigint(20)

允许

6

userid

用户编号

bigint(20)

允许

7

username

用户名

varchar(200)

允许

8

isdone

状态

varchar(200)

允许

表4.3   users管理员信息表

序号

字段

描述

类型和长度

主键

是否可空

1

id

编号

bigint(20)

不允许

2

username

用户名

varchar(100)

允许

3

password

密码

varchar(100)

允许

4

role

角色

varchar(100)

允许

5

addtime

添加时间

timestamp

允许

表4.4  yonghu用户信息表

序号

字段

描述

类型和长度

主键

是否可空

1

id

编号

bigint(20)

不允许

2

addtime

创建时间

timestamp

允许

3

yonghuzhanghao

用户账号

varchar(200)

允许

4

mima

密码

varchar(200)

允许

5

yonghuxingming

用户姓名

varchar(200)

允许

6

xingbie

性别

varchar(200)

允许

7

shouji

手机

varchar(200)

允许

8

youxiang

邮箱

varchar(200)

允许

9

shenfenzheng

身份证

varchar(200)

允许

10

zhaopian

照片

varchar(200)

允许

表4.5  zuozhe作者信息表

序号

字段

描述

类型和长度

主键

是否可空

1

id

编号

bigint(20)

不允许

2

addtime

创建时间

timestamp

允许

3

zuozhezhanghao`

作者账号

varchar(200)

允许

4

mima

密码

varchar(200)

允许

5

zuozhexingming

作者姓名

varchar(200)

允许

6

xingbie

性别

varchar(200)

允许

7

shouji

手机

varchar(200)

允许

8

youxiang

邮箱

varchar(200)

允许

9

shenfenzheng

身份证

varchar(200)

允许

10

zhaopian

照片

varchar(200)

允许

表4.6  `wenzhangfenlei文章分类信息表

序号

字段

描述

类型和长度

主键

是否可空

1

id

编号

bigint(20)

不允许

2

addtime

创建时间

timestamp

允许

3

leibie

类别

varchar(200)

允许

第5章 系统的实现

5.1微信端功能模块的实现

5.1.1注册登录界面

没有账号的用户可进行注册操作,注册时可选择注册类型进入对应角色的注册界面,注册后可进行登录系统,微信端注册登录界面展示如图5.1所示。

图5.1 微信端注册登录界面

5.1.2首页界

所有用户登录后均可进入首页查看首页信息,首页界面展示如图5.2所示。

图5.2首页界面

5.1.3文章界面

用户登录后可查看文章信息,并可根据条件快速查询所需文章,可选择文章进行查看详情操作,文章界面展示如图5.3所示。

图5.3 文章界面

5.1.4我要发帖界面

作者和用户登录后均可进行发帖操作,我要发帖界面展示如图5.4所示。

图5.4 我要发帖界面

5.1.5添加文章界面

作者登录后可进行添加文章操作,添加文章界面展示如图5.5所示。

图5.5 添加文章界面

5.1.6我的收藏管理界面

用户和作者均可管理个人收藏信息,我的收藏管理界面展示如图5.6所示。

图5.6 我的收藏管理界面

5.2管理员功能模块的实现

5.2.1管理员登录界面

管理员要想进入系统后台对系统进行管理操作,必须登录系统后台,管理员登录界面展示如图5.7所示。

图5.7 管理员登录界面

5.2.2用户管理界面

管理员登录后可添加、修改和删除用户信息,用户管理界面如图5.8所示。

图5.8 用户管理界面

5.2.3作者管理界面

管理员在作者管理界面可查看所有作者信息,对已有作者信息可进行编辑和删除操作,同时也可添加作者信息,作者管理界面如图5.9所示。

图5.9  作者管理界面

5.2.4文章管理界面

管理员可管理文章信息,对已有文章信息可进行编辑和删除,文章管理界面展示如图5.10所示。

图5.10 文章管理界面

5.2.5文章分类管理界面

管理员可增删改查文章分类信息,文章分类管理界面展示如图5.11所示。

图5.11 文章分类管理界面

5.2.6论坛管理界面

管理员可管理论坛信息,论坛管理界面展示如图5.12所示。

图5.12 论坛管理界面

Logo

AtomGit 是由开放原子开源基金会联合 CSDN 等生态伙伴共同推出的新一代开源与人工智能协作平台。平台坚持“开放、中立、公益”的理念,把代码托管、模型共享、数据集托管、智能体开发体验和算力服务整合在一起,为开发者提供从开发、训练到部署的一站式体验。

更多推荐