基于微信小程序的通用报名系统设计与实现

凌锦涛，周 红，林志洁

(1.浙江科技学院 信息与电子工程学院，杭州 310023；2.温州市文成县公安局，浙江 文成 325300)

随着移动互联网的快速发展，移动端的App也随之进入迅猛发展的时期。高校的学生活动相比过去也逐渐增加,为了提高报名与信息采集效率，出现了各式各样的信息收集类的平台，目前这些平台都是基于Web来实现的[1-2]。Web作为当今互联网最主要的信息传播方式之一[3]，存在着众多的安全隐患，如钓鱼网站、XSS攻击[4]、网络加密不安全[5]、SQL注入[6]、分布式拒绝服务攻击[7]等潜在危险。微信小程序的市场优势有:流量来源多样化，利用社交关系传播，搜索广告与公众号嵌入[8]。技术方面的优势有:小程序可嵌入其他微信小程序平台的功能模块，便捷地运用其工具，得以快速地实现其功能。用户信息方面的优势有:小程序可便捷地获取用户微信账号，用户不必注册登录，并可充分利用微信用户之间的社交网络进行推广[9]。与移动App相比，微信小程序不必安装较大的App，可在微信平台上实现原本只能在原生态App才能实现的效果和功能。微信小程序无需下载安装，即开即用，用完即走，省流量，省安装时间，不占桌面[10]。相对于Web开发，微信小程序的开发难度低，有利于快速搭建独立安全的报名平台。由于微信小程序的搭建基于微信平台，受腾讯公司监督，可置信程度高，故推广更容易。

1 系统设计

依靠微信平台，微信小程序可自动获取用户个人信息并填写，从而更加有效地过滤垃圾信息和追溯信息来源，进一步加强网络安全。这样就能更方便地开展活动宣传和报名统计，使得活动组织者能够将精力和资金集中于活动安排本身。基于微信平台的报名方式能够获得比其他平台更丰富的用户信息，使活动组织者能够更深层次地挖掘报名者的倾向，使活动更加贴合实际需求。

1.1 需求分析

1.1.1 系统应用场景

系统的用户包括高校的管理人员、社团组织者、企业活动的组织者、社会活动的组织者和各类社会调查的组织者。用户可自定义活动报名表，实现专属的报名表。如考勤人员可用该系统作为考勤签到工具[11]；社会调查组织者可制作调查问卷，甚至可用来完成心理测试；社团活动中可将其与社团宣传海报相结合使用。为方便用户寻找活动地点，组织者可通过地图定位，设置活动举办地点，以方便查看。为方便活动组织方筹划，管理者可获取用户所在位置，统计报名用户所在地以获得报名者分布情况。

1.1.2 用户需求分析

系统用户分为管理员和普通用户，其中管理员可审核用户的报名表，查看报名表的提交情况，还可禁止用户发布报名表。普通用户分为活动组织者和报名者。活动组织者可设计、创建报名表，查看报名结果，预览报名页面，支持多渠道分发报名表，查看下载报名统计结果。报名者可通过活动组织者提供的报名表进行报名。报名表设计者可允许报名者查看其他报名的好友，在地图上查看活动举办地点的定位并使用地图导航，在报名者提交报名信息后查看提交结果。报名者可选择拒绝系统获取个人信息，以保护隐私，亦可让系统自动填充个人信息。

1.2 总体设计

系统包含用户信息管理、报名表管理与设计、报名表审核与展示、信息统计六模块。各模块相辅相成，有机组成该系统，模块间只有数据耦合，充分体现高内聚、低耦合的特点。图1为各模块间的数据流图。

图1 各模块间的数据流图Fig.1 Data flow diagram among modules

1.2.1 用户信息管理

管理员可有多位，是系统的运维人员,可对用户进行权限管理操作，以防不法用户发布敏感内容造成恶劣影响。由于系统维护过程中可能出现新的特性，当影响到用户已存在数据时，管理员还可发布公告。管理员可查看普通用户提交的建议和对违规报名表的举报，以便管理员及时纠正错误，改进管理方式和重新审核报名表。

1.2.2 报名表管理

发布报名表的用户可组织不同的活动，活动的内容和报名表信息不尽相同，故必须支持用户智能化管理报名表。用户可将自己的报名表或其他用户所共享的报名表作为模板，以增加设计的复用率，提高工作效率和保持界面的一致性。

本刊讯：2018年11月10日，（中国）消费经济学会2018年会暨第二十一次全国消费经济理论与实践研讨会在四川成都隆重召开。为了塑造学会品牌，扩大学会影响力，激发学会活力，打造产学研一体化平台，进一步发挥学会在学科研究和经济社会发展中的积极作用，经（中国）消费经济学会批准，成立（中国）消费经济学会白酒专业研究委员会。中国沈酒集团沈鸿林董事长全票当选（中国）消费经济学会白酒专业研究委员会首届会长。

1.2.3 报名表设计及展示

不同活动有各自的报名表，丰富的活动内容要通过系统报名表的设计和展示这两个模块来体现。报名表设计模块可设置宣传海报图片以吸引报名者，可填写活动地址提供定位和导航服务。在活动介绍中用户可设置指定的微信用户，并显示其头像，报名者可点开此头像来获取此微信用户的联系方式，以减少活动和报名者之间的距离感。系统可设置默认获取的用户基本信息内容，在报名者打开报名表后，微信将询问是否允许自动获取此类信息，以减少用户报名的复杂度，提高报名者的舒适感。对涉及报名费的活动，报名表中可设置添加支付功能，报名者可直接通过微信支付报名费，也可在报名后申请退款放弃该活动，以方便活动组织者收取活动费用，减少纠纷。用户可自定义报名表内容，设置必填内容等要求，问题的回答方式包含输入框、单选、多选等。报名表审核通过后，报名者可通过发布者分享的报名信息，如口令、二维码[12]等入口访问报名表页面。

1.2.4 报名表审核

图2 后台表单审核页面Fig.2 3S Background form audit page

系统报名表最终展示的效果取决于用户，若不加监督，恶意用户将会在报名表中加入侵犯隐私甚至违法的问题，非法收集用户隐私信息。报名表审核模块为系统预防此类问题的关键部分。报名表审核分3步，第1步由系统进行敏感字符检索，若出现敏感字符，将提示用户进行更改；第2步由系统结合已有数据库为报名表打分，列出该报名表可能存在的问题，作为人工审核的参考依据，以减轻人工审核负担；第3步由平台管理员进行人工审核操作，决定是否允许该报名表发布。若审核未通过，管理员需要给出审核未通过的具体原因，通知用户结合具体原因再行修改。对于提交不良内容的提交者，管理员可采取限制发布报名表次数、限制提交频率、禁止发布报名表、注销账号等措施进行惩罚。管理员审核通过后，系统将摘取该报名表的部分信息，使用哈希散列算法为其生成口令和二维码，提供分享的接口，以方便用户宣传。审核页面如图2所示。

1.2.5 信息统计

报名截止后，用户需要有快速直观的方法查看报名数据，如用户地理位置信息分布情况、各个选项选择比例情况、用户提交的数据概览等信息。系统采用EChart插件实现此功能，EChart插件是一款图标库，可在绝大部分浏览器(包括微信小程序)上显示直观、生动、可交互、高度个性定制化的数据可视化图表。利用该插件，系统可将地理位置信息转换至地图展示(图3)；可将选项的选择比例用饼状图显示，提取用户提交内容中的关键词，生成字符云图(图4)。将数据可视化方便了用户分析报名数据，并提高工作效率。系统支持下载和删除报名表功能，提供CSV形式的表单数据下载功能，其中，选项信息将被转换成文本格式，图片信息转换成Base64编码格式。用户下载数据后，可以使用相关工具对Base64格式的图片进行解码显示。

图3 报名分布Fig.3 Registration distribution

图4 数据摘要字符云Fig.4 Data digest character cloud

2 系统的实现

2.1 技术分析及架构

2.1.1 前端架构

报名系统基于微信小程序，前端开发语言采用WXML和WXSS。WXML是一种类似于HTML的XML语言,用于组织页面结构;WXSS是一种近似于CSS的样式表，用于表述WXML的显示方式;逻辑层使用的Java Script语言与Web使用的开发语言一致[13]。

2.1.2 后台架构

系统的数据采用关系型数据库MySQL存储；后台语言采用Java，Java是一种能够在计算机软件的各个层面都发挥作用的面向对象的程序语言；应用服务器采用Tomcat，因为Tomcat是目前Java或JSP应用系统所普遍采用的应用服务器[14]，运行效率高，稳定性好。系统采用Spring MVC框架、Spring IoC/DI和Spring JDBC技术构建三层架构,简称3S架构方案，为轻量级架构方案。这样，不但简化了代码编写,还实现了Spring重要的“解耦”思想[15]，所实现的系统具有更好的性能。技术架构如图5所示。微信小程序前端页面只与Spring MVC层中的前端控制器交互，前端控制器控制显示页面，负责调用业务处理对象和后端控制器来获取前端页面所需要的界面，处理前端传输回来的数据。后端控制器调用业务层的业务接口来实现某项业务，而业务逻辑是采用IoC(inversion of control)的容器来实现，IoC控制着不同类的访问以实现充分的解耦。数据层中由Spring JDBC实现数据库访问的接口。

图5 3S轻量级三层架构方案Fig.5 3S lightweight three-tier schema diagram

2.1.3 方案优势

目前，国内外较流行的系统平台架构主要有J2EE平台、LAMP平台、ASP.NET平台3种。J2EE是一种多层Web应用架构，并以Struts2、Spring和Hibernate成为多层架构的典型，即经典SSH的三层架构解决方案[16]，该方案的三层架构中，由于Struts2、Spring和Hibernate是3种不同类型的开源框架，来自各不相同的组织机构，并在应用中担任不同的任务，后期技术整合时会出现XML文件及程序代码不兼容的情况，导致开发周期延长、维护困难、性能低下等问题。LAMP是Linux、Apache、MySQL、PHP组合而成的开放资源网络平台[17]，该方案需要Linux运行环境，开发和调试困难，后期部署时容易造成代码不兼容问题。Apache系统服务器虽然软件成熟、运行稳定，但消耗资源更多、支持的并发连接数少。ASP.NET是微软旗下的Web平台，该平台开发者较少、社区活跃程度不足、信息更新频率慢、受微软公司影响，跨平台部署应用会受限制。

3S架构与其他3种架构的质量特性比较见表1。

表1 3S架构与其他架构方案的比较Table 1 Comparison of 3S architecture with other architectural schemes

2.2 试验结果

试验实现了报名系统的核心功能，对所提方案的可行性进行了验证。通过代码覆盖测试和为期14 d的不间断运行和随机访问测试表明，所提方案能快速地部署基于微信小程序的通用报名系统。在不同操作系统和应用场景下，系统都能稳定高效运行，具有较好的适应性。系统在大数据产业论坛的报名活动中进行了应用，可满足活动报名需求。

3 结 语

本研究设计了一套基于微信小程序的通用报名系统实现方案，对应于不同应用场景下的需求设计了6个模块，实现了系统的核心功能。通过试验和分析，验证了所提方案的可行性、稳定性、高效性以及在不同应用场景的适应性。通过使用本系统发布的活动报名表收集报名者信息，表明本系统可有效提高活动组织者的宣传与报名信息收集效率，使活动组织者可将精力集中于活动本身，使活动报名者充分了解活动情况，并提高报名统计效率。