5
10
15
20
25
30
35
40
中国科技论文在线
http://www.paper.edu.cn
基于微信公众平台的创客系统的设计与实
现
盛芮宾,任维政**
(北京邮电大学电子工程学院,北京 100876)
摘要:本文设计并实现了一款基于微信公众平台的创客系统,旨在为广大的创客爱好者尤其
是青少年提供一个学习经验、交流心得的平台;同时在后期依靠平台能够获利。平台上的课
程均为名师录制,在功能方面支持用户在平台上观看课程,分享课程,购买课程;同时支持
用户在用户社区交流,上传并与他人互动分享自己的作品。平台也包含了用户信息系统,对
不同权限的用户拥有不同观看课程的程度
关键词:计算机应用技术;微信公众平台;创客系统;社区交流平台
中图分类号:TP399
The Design and Implement of the Hacker System based on
WeChat Platform
SHENG Ruibin, REN Weizheng
100876)
(School of Electronic Engineering,Beijing University of Post and Telcommunication,Beijing
Abstract:This paper design and implements a hacker system based on Wechat platform, aims to
provide a platform for learning and exchange of experiences for the vast number of creators, especially
young students. At the same time, we hope to make a profit relying on the platform in the later stage.
The courses on the platform are recorded by famous teachers. In terms of functions, users are allowed
to watch courses on the platform, share courses, and purchase courses. At the same time, users are
allowed to communicate in the user community, upload and interact with others to share their work.
The platform also includes a user information system that allows users of different rights to have
different levels of viewing.
Keywords: Computer Application Technology; Wechat Public Platform; Hacker System; Community
Communication Platform
0 引言
创客一词最早起源于一部科技作品,其中指出,创客运动是推动网络智慧在现实世界应
用、掀起全民发明创造活动热潮的重要,将引发新一轮工业革命。而在当下,对“创客”一词
的解释为,有独立想法并把想法变成现实产品的人,是热衷于创意、设计、制造的个人设计
制造群体。这一概念的两大核心是“动手实现”和“自己的想法”。随着自媒体时代的到来以及
自我创新理念的深入人心,越来越多的人乐于动手实现,并且把自己的想法和作品同他人分
享;同时这些群体在产出东西的同时也需要去获得知识,学习其他人的东西来充实自己。另
一方面,人工智能时代已经正式来临,青少年对于机器人编程的热情也愈发高涨,本创客系
统的目的就是在青少年机器人教育领域建立一个这样的系统平台,为推进青少年之间交流互
助,学习心得做出一点自己的努力。
作者简介:盛芮宾(1994-),男,无,主要研究方向:移动互联网技术
通信联系人:任维政(1974-),男,副教授,硕导,主要研究方向:智能交通车联网. E-mail: renwz@bupt.edu.cn
- 1 -
中国科技论文在线
1 微信公众平台特点
http://www.paper.edu.cn
1.1 关于微信公众平台及微信生态的概述
微信拥有着天然的巨大流量,在 2017 年底腾讯公司公布的《2017 微信数据报告》中,
微信的日登陆用户数达 9.02 亿,日发送消息次数 380 亿,朋友圈日发表视频次数 6800 万,
公众号月活跃账号数 350 万,月活跃粉丝数 7.97 亿。这些数据无不证明着微信它中国互联
网市场上流量霸主的地位。2012 年 8 月,微信上线了“微信公众号”——它成为了微信在“浏
览器阶段”的代表性大招。随后,经过 2014 年“微信红包”的横空出世,微信支付正式走入人
们的视野,有了海量流量+海量内容的基础,又有了海量流量+支付工具属性+用户的支付使
用习惯,微信开始着手将人与大量服务之间做链接。2017 年,微信发展全面进入“成熟期”,
而微信“OS 阶段”的最后一块拼图微信“小程序”也正式上线。可以看到微信首先拥有足够多
的人,其次拥有足够多的内容,现如今同样集成了足够多的应用在其中;微信的流量对于当
前的互联网市场来说,是已经集成好的,电商互联网平台拼多多就是利用微信平台的流量发
展起来的成功案例,如果能够利用好微信平台以及微信生态,也就在平台发展的初期拥有了
天然的良好基础。平台的功能设计也将事半功倍。
1.2 微信公众平台对于创客系统的优劣势
自 2012 年 8 月,腾讯推出微信公众平台以来,微信公众账号不断涌现,截止目前为止,
微信公众账号数量已达百万级别,具有了极大的社会影响力。虽然微信公众平台早已度过红
利期,但是截止到 2018 年,保持正常更新的公众号仍然高达 350 万个,同比增长 14%,月
活关注用户仍然有 7.97 亿,比去年同期增加了 19%。与同时间段统计的微信日活的 10 亿这
个数字相比,对公众号关注的用户还是占很大比例的。
可以看出广大的中国用户对于微信公众号的认可程度仍然很高,在微信公众平台的基础
上开发创客系统首先就保障了用户的基数,微信坐拥 10 亿日活,已经成为了中国人互联网
社交必不可少的工具,“创客”顾名思义,是需要大量用户交流互动的,没有流量的创客活动
是不能称之为创客的;其次,微信为自己公众平台设置的传播通道也必将给创客系统以最大
的方便,在传播上面更加直接有效;而后,微信集微信公众号-内容部分、微信小程序-应用
部分、微信支付-支付部分于一身,更加方便了诸如内容链接、付费内容支付、辅助应用功
能开发等平台的必须步骤。最后,在公众平台上去做创客系统,相较于小程序,拥有另外一
项优势——可以把公众号的内容和创客系统功能相结合,创客教育内容的前沿推送和创客教
学的用户交互部分相结合,减少用户的操作步骤,加强用户学习内容,获得内容的效率。
但与此同时,微信公众账号的过量充斥,也让平台内容是否能够在海量的公众号当中分
得一杯羹,面临着极大的难度和挑战。应用平台作为微信公众号的形式,是否能够让用户获
得如同小程序或者 app 般的操作体验,同样是一个需要考量的因素。坐拥超过 3 亿用户的微
信公众平台,已经成为中小互联网平台的兵家必争之地,如何拥有自己独特的传播方式和运
营模式,创新点对本课题来说也是一个难题。
45
50
55
60
65
70
75
- 2 -
中国科技论文在线
http://www.paper.edu.cn
2 开发环境运行环境以及关键技术介绍
2.1 开发环境
该系统是在 Windows 7 操作系统下、JDK 8 、Eclipse 8.5、HBuilder9.0.2、MySQL5 为
工作环境开发。
2.2 运行环境
运行环境为:Tomcat8.0、maven 仓库
Tomcat 是由 Apache 开发的一个 Servlet 容器,由于 Tomcat 本身也内含了一个
HTTP 服务器,它也可以被视作一个单独的小型的轻量级的 Web 服务器,可以通过编辑 XML
格式的配置文件来进行配置,属于轻量级应用服务器,在很多场合下被普遍使用,是开发和
调试 JSP 程序的首选。它的作用主要是用来响应HTML页面的访问请求,作为前端用户动作
行为和后台业务处理对接的桥梁。
Maven 是基于项目对象模型(POM Project Object Model)设计,可以通过一小段描述信息
(配置文件)来管理项目的构建、报告和文档的软件项目管理工具,通过 pom.xml 文件来
获取 jar 包,同时也可以通过 pom.xml 管理项目的整个声明周期,包括清除、编译、测试、
报告、打包、部署等。
2.3 系统采用的关键技术
本系统应用中间包含了很多关键技术,其中主要包括 Web 开发框架、服务器后端框架、
数据库等,以下做简单介绍。
2.3.1 B/S 架构(Browser/Server)
B/S 架构也称浏览器/服务器模式,是在 Web 浏览器兴起后形成的一种新型的网络结构
模式。这种模式一定程度上简化了用户端,将整个系统的大部分功能全部集成到服务器端,
明显的优化了程序的开发、维护和使用过程。在用户端,只需使用浏览器就可以使用到 Web
功能,如 360 浏览器、谷歌浏览器等,用户可以使用浏览器通过 Web 服务器和数据库做交
互,交互的结果将会以网页的形式显示在浏览器端。而 Server 服务器端则需要配置对应的
DB、MYSQL 等数据库,B/S 架构的常用形式如图 1 所示。
工作流程主要包括四个步骤:(1)向客户端发送请求。用户在客户端浏览器页面提交
表单操作,向应用服务器发送请求获取或者提交信息,等待服务器响应;(2)服务器端处
理请求。服务器端接收并处理来自用户浏览器端的请求,应用服务器端通常使用服务器端技
术对请求进行数据处理,并产生响应。(3)服务器端发送响应。服务器端把用户请求的数
据(网页文件、图片、声音等等)返回给浏览器。(4)浏览器解释执行 HTML 文件,翻译
并呈现用户界面。
80
85
90
95
100
105
- 3 -
中国科技论文在线
http://www.paper.edu.cn
110
B/S 的优势在于:
图 1 B/S 架构示意图
Fig. 1 B/S architecture diagram
115
120
125
130
(1)用户无需安装任何 app,只需要 web 浏览器即可完成对需要内容的查找和观看等;
(2)可以直接放置于广域网,通过一定的权限控制实现多客户访问的目的,同时也能在客
户端电脑上进行部分处理,大大减轻服务器的负担,且有较强交互性,进行局部实时刷新;
(3)无需升级多个客户端,只需要升级服务器即可,版本随时更新;
(4)利用了不断成熟的 Web 浏览器技术,结合浏览器的多种脚本语言和 ActiveX 技术,用
通用浏览器实现原来需要复杂专用软件才能实现的强大功能,节约了开发成本。
2.3.2 Spring 框架
Spring 是一个轻量级的开源框架,其核心是控制反转(IoC)和面向切面(AOP)。它
是为了降低企业级应用的开发复杂性而创建的,是分层架构模式,分层架构允许使用者任意
选择使用组件,同时为 J2EE 应用程序开发提供集成的框架。
Spring 框架拥有很多的优点:
(1)它从大小与开销两方面而言都是轻量的。完整的 Spring 框架可以在一个大小只有 1MB
多的 JAR 文件里发布。并且 Spring 所需的处理开销也是微不足道的。此外,Spring 是非侵
入式的:典型地,Spring 应用中的对象不依赖于 Spring 的特定类。
(2)方便解耦,简化开发。Spring 通过一种称作控制反转(IoC)的技术促进了松耦合。当
应用了 IoC,一个对象依赖的其它对象会通过被动的方式传递进来,而不是这个对象自己创
建或者查找依赖对象。你可以认为 IoC 与 JNDI 相反——不是对象从容器中查找依赖,而是
容器在对象初始化时不等对象请求就主动将依赖传递给它。
(3)支持声明式事务。Spring 提供了面向切面编程的丰富支持,允许通过分离应用的业务
逻辑与系统级服务(例如审计(auditing)和事务(transaction)管理)进行内聚性的开发。
应用对象只实现它们应该做的——完成业务逻辑——仅此而已。它们并不负责(甚至是意识)
其它的系统级关注点,例如日志或事务支持。
(4)方便程序测试。Spring 提供了面向切面编程的丰富支持,允许通过分离应用的业务逻
辑与系统级服务(例如审计(auditing)和事务(transaction)管理)进行内聚性的开发。应
- 4 -
中国科技论文在线
http://www.paper.edu.cn
135
140
用对象只实现它们应该做的——完成业务逻辑——仅此而已。它们并不负责(甚至是意识)
其它的系统级关注点,例如日志或事务支持。
(5)方便集成各种优秀框架。Spring 可以将简单的组件配置、组合成为复杂的应用。在 Spring
中,应用对象被声明式地组合,典型地是在一个 XML 文件里。Spring 也提供了很多基础功
能(事务管理、持久化框架集成等等),将应用逻辑的开发留给了你。
(6)降低 JavaEE API 的使用难度。Spring 对 JavaEE 开发中非常难用的一些 API(JDBC、
JavaMail、远程调用等),都提供了封装,使这些 API 应用难度大大降低。
所有 Spring 的这些特征使你能够编写更干净、更可管理、并且更易于测试的代码。它
们也为 Spring 中的各种模块提供了基础支持。
2.3.3 MVC 框架
145
MVC 是一种使用 MVC(Model View Controller 模型-视图-控制器)设计创建 Web 应
用程序的模式,MVC 设计方式用一种将业务逻辑、业务数据和操作展示界面显示分离的方
法组织代码,将业务逻辑聚集到一个部件里面,这样改进就可以允许编程者在改进个性化界
面及用户交互的同时,无需重新编写业务逻辑。其中,Model(模型)是整个应用程序中用
150
于处理应用数据逻辑的部分,通常模型对象负责在数据库中存取数据,模型代表一个存取数
据的对象或 JAVA POJO。它也可以带有逻辑,在数据变化时更新控制器。View(视图)是
应用程序中处理数据显示的部分,即用于数据的可视化。通常视图是依据模型数据创建。
Controller(控制器)是应用程序中负责处理用户交互操作的部分,负责从视图中读取
数据,控制用户输入,并向模型发送数据。总结为两点:一是把用户请求分发到相应的模型,
二是把模型的改变及时地反映到视图上。
155
2.3.4 MySQL 数据库
MySQL 是一个关系型数据库管理系统,由瑞典 MySQLAB 公司开发,目前属于 Oracle
旗下产品。MySQL 是最流行的关系型数据库管理系统之一,在 WEB 应用方面,MySQL
是最好的 RDBMS (Relational Database Management System,关系数据库管理系统) 应用软
件之一。
160
MySQL 是一种关系数据库管理系统,关系数据库将数据保存在不同的表中,而不是将
所有数据放在一个大仓库内,这样就增加了速度并提高了灵活性。
MySQL 所使用的 SQL 语言是用于访问数据库的最常用标准化语言。MySQL 软件采用
了双授权政策,分为社区版和商业版,由于其体积小、速度快、总体拥有成本低,尤其是开
放源码这一特点,一般中小型网站的开发都选择 MySQL 作为网站数据库。它使用 C 或 C++
编写,并使用多种编译器进行测试,保证源代码可移植性。支持 Linux、Mac OS、Windows
等多种操作系统。为多种编程语言提供了 API。这些编程语言包括 C、C++、Python、Java、
PHP 等。支持多线程,充分利用 CPU 资源。优化的 SQL 查询算法,有效地提高查询速度。
既能够作为一个单独的应用程序应用在客户端服务器网络环境中,也能够作为一个库而嵌入
到其他的软件中。提供多语言支持,常见的编码如中文的 GB 2312、BIG5,日文的 Shift_JIS
等都可以用作数据表名和数据列名。提供 TCP/IP、ODBC 和 JDBC 等多种数据库连接途径。
提供用于管理、检查、优化数据库操作的管理工具。支持大型的数据库。可以处理拥有上千
165
170
- 5 -
中国科技论文在线
万条记录的大型数据库。支持多种存储引擎。
http://www.paper.edu.cn
3 基于微信公众平台的创客系统的设计与实现
3.1 创客系统的组成模块
175
创客系统整体需要三部分来支撑,首先是创客系统的后端数据库,主要存放课程内容、
用户自传课程以及用户数据信息等;第二部分是创客系统的管理系统,作用是为创客系统前
端增删改查内容;第三部分是创客系统的前端部分,用来满足用户的交互以及创客内容发布
等。
网页登陆地址:www.younghold.com
180
3.1.1 创客系统的后端数据库
本系统搭建了独立的后台数据库系统在服务器上,数据库建有共 128 个表格,实现功能
30 余项,主要分为用户部分功能和课程部分功能两大类。
(1)用户部分功能
登陆注册:用户在进入平台后,可以选择通过手机号与密码或验证码登录进入平台。如
185
初次使用则需用户在观看视频课程之前进行注册,注册使用手机号或微信账号均可。同时提
供找回密码功能,找回方式同样为发送验证码到手机,使用验证码修改最新密码。平台的登
陆方式可以通过微信公众号平台的入口,同时也可以通过 web 端浏览器入口。
个人中心:用户可以在平台的个人中心对个人信息进行查看和管理,可查看或修改个人基本
190
信息如用户昵称、用户性别等;可以查看个人课程信息如我的订单、我的积分、我的观看记
录、我的收藏等。
社区交流:用户可以平台上观看社区其他人的作品,点赞他人作品或者收藏他人作品,
同时可以上传自己录制的作品。这里面就包括了上传功能,系统调起移动手机的相册功能选
择手机中的视频文件、选择手机中的图片作为作品封面图片作为素材上传;编辑上传内容功
能,删改作品功能等。查看作品,评价作品,用户可以在社区中浏览并查看已经通过审核的
全部作品,在列表中可以浏览到作品名称、作品作者以及作品评分。作品详情页面中,可以
查看到更加详尽的信息,包括作品简介、同作者作品以及用户评价。
用户部分的功能总结如下图所示:
195
- 6 -
中国科技论文在线
http://www.paper.edu.cn
200
(2)课程部分功能
图 2 后端用户部分功能
Fig. 2userpartfunction
课程搜索:平台提供对课程的搜索功能,用户在平台首页后在输入栏输入搜索信息即可。
205
搜索范围为全部课程,搜索方式支持按着课程名搜索或按着课程作者搜索,支持关键字搜索,
搜索结果根据关键字的匹配程度进行默认排序供用户选择。
课程信息查看:在课程模块,课程以分类列表的形式展示,展示信息包括课程名称、课
程类别、课程价格以及课程的发布时间、同时还包括课程的收费类型。课程信息于后台操作
同步更改。进入课程的具体详情页面后,可以进行短时间的课程试看,用户免费学习一段时
间课程;信息资料上,可以查看课程的参与人数、课程简介、相同作者的其他课程和其他用
210
户对该课程的详细评价。同时可以方便地对课程进行转发或者收藏,转发会跳转至微信平台
的转发界面,收藏过的课程则会进入到用户的个人中心-我的收藏里。
课程观看:待用户登录后可以进行课程观看学习的相关操作,平台在课程详情页嵌入了
网页视频播放器,可以在线直接学习课程,同时部分课程支持转换为音频模式学习。若课程
215
免费,用户登录后可直接学习;若课程收费则需要用户对指定课程付费后学习。播放课程视
频的过程中,支持用户进行暂停、快进等操作。
图 3 后端课程部分功能
Fig. 3coursepartfunction
- 7 -
中国科技论文在线
3.1.2 创客系统管理系统
http://www.paper.edu.cn
220
225
管理系统是一个平台日常维护稳定运行,保障用户使用顺畅的必须的部分,本创客系统
的管理系统可以分为三个部分,如下:
用户管理:包括新注册用户的统计管理,付费用户管理,用户权限管理,用户信息用户
课程信息的管理等。对用户数据做出统计。
课程管理:这里的课程主要指平台的原创课程,对课程进行增加删除,分类,权限编辑,
课程展示内容编辑,课程时间编辑,课程板块编辑等。同时还会对课程的播放量,课程留存
率,课程的热度进行统计。
社区管理:对用户在社区上传的自创内容审核、对所有社区分享内容排版布局,统计优
秀的社区内容的播放量等。功能包括用户分享视频的信息查看、审核、删除。同时,针对各
个分享视频的评论内容可进行对应的查看、删除。
230
3.1.3 创客系统前端功能
235
240
245
250
本系统的前端主要使用 html5 编写,目的是为了让平台既能够通过微信引擎启动,也可
以灵活地通过其他浏览器启动。前端采用了通用性的跳转样式,页面样式等。前端功能对应
后端功能同样可以分为两个部分。
用户部分:负责获取到用户的登陆注册信息,返给后台做功能处理;接收到后台的处理
结果在前端展示出来;获取用户对于个人中心以及社区的操作动作,与后台数据库对接同步,
完成用户的操作。
课程部分:获取到用户的搜索关键字并解析匹配,吧搜索到的内容反馈给用户端;课程
播放时获取用户的点击播放动作,通过后台判断用户权限,返回针对不同权限的播放模式的
播放内容呈现。
3.2 基于微信平台开发的优点
3.2.1 传播方便
本系统是作为微信公众号里面的应用呈现出来的,作为系统的设计方,希望平台能够在
初期快速地推广,拥有初期较为不错的用户积累,在用户对于平台的传播或者课程的传播上
面有着天然的优势,通过微信的关系网可以很快地达到传播平台传播课程的目的,用户通过
系统内部的分享按钮或者微信公众号自带的分享位置,都可以轻松快速地把内容课程分享出
去。作为用户,在创客平台上沟通交流观看课程的心得。
3.2.2 用户体验优秀
同时,作为创客用户,希望的是能够把自己观看课程的心得体会与感兴趣的人一起分享,
微信天然的强社交属性,让分享课程心得非常方便且成本低廉。微信其他服务体系的健全,
如小程序的普及,让创客平台衍生内容(如创客教具在微店上的售卖)能够更加方便地运行;
支付系统的成熟,让课程付费支付等行为变得方便。对于用户来讲使用过程非常顺手。
3.2.3 微信平台的内容管理布局
微信拥有海量的内容,面对如此多且冗余的内容,微信公众平台官方设置了微信公众账
号评级,同时现如今也加入了好友推荐功能,且吧公众号内容从整个微信生态中逐渐剥离出
- 8 -