基于微信小程序的签到系统设计与实现
2018-08-07陈少涌李哲夫许晓旋朱华森
陈少涌 李哲夫 许晓旋 朱华森
摘 要:签到是高校最常见的应用场景之一,而现有的签到解决方案仍存在效率低下等不足。以微信为代表的移动互联网应用广泛普及,为高校签到系统的改进提供了有利条件。本文结合微信小程序和LBS、TOTP技术,提出了一种在移动互联网上基于微信小程序的签到系统,对该系统的各个模块和功能都进行了详细的说明,并对系统的关键技术进行了深入分析,包括签到人的身份鉴别、基于地理位置实现信息推送及服务、支持多应用场景的签到服务等。
关键词:签到系统;微信小程序;微信公众号;二维码;LBS;TOTP
中图分类号:G647 文献标志码:A 文章编号:1673-8454(2018)11-0087-06
一、引言
簽到是高校最常见的应用场景之一,包括会议、活动、课堂、讲座都有签到需求。现有的签到方式以纸质签到和校园卡刷卡签到为主,这两类签到方式都存在诸多弊端。纸质签到在面对一些大型会议和活动时,面临着签到效率低下、需要进行二次数据整理录入才能完成统计分析的问题。校园卡刷卡签到模式依赖于校园卡、读卡器以及安装了校园卡签到客户端程序的计算机,每次开会都需要工作人员提前准备并且在现场值守,且校园卡签到功能通常作为校园卡系统的子功能模块,系统较为封闭,难以实现面向二级单位提供管理功能,难以实现与其他系统的良好集成,无法实现面向用户发送会议通知等实用功能。[1]签到效率的低下,使活动主办方需要额外付出大量人力和精力,参会人员也经常因为没有及时获得通知提醒而错过会议,或在现场排队签到耽误进场时间等问题导致参会体验低下。
近年来,以微信和微信公众号为代表的移动互联网应用兴起,已深刻影响着各行各业,在提升信息化服务效率的同时,有效提升了用户体验。由于高校里的签到业务具有典型的线上和线下融合(O2O)特点,因此借助微信实现智能化签到具有较高的可行性及应用价值。[2,3]
本文在分析高校签到业务需求的基础上,针对原有签到方式的不足,提出了基于微信小程序的签到系统的整体设计方案,并介绍了系统的实现及应用流程。该系统已在暨南大学成功部署并在大型会议等场合投入应用,有效提升了签到业务的信息管理功能,优化了签到流程,改进了用户体验,深受师生欢迎。
二、微信公众号和微信小程序
微信是腾讯公司于2011年1月推出的一款智能手机即时通信软件。中国互联网络信息中心(CNNIC)报告显示,2016年网民最常使用的APP应用是即时通信,其中79.6%的网民最常使用的是微信,其次是QQ。[4]2017年第三季度,微信和海外的WeChat的合并月活跃账户数达到9.8亿,比去年同期增长15.8%。[5]伴随着用户数增长,微信的功能也越来越强大,支持群组、文字、图片、语音、视频交流、位置共享、朋友圈分享、游戏和微信支付等系列服务。
1.微信公众号
2012年起,微信推出了微信公众平台,支持个人和机构通过公众号面向关注公众号的用户推送消息,并借助微信公众平台开放接口提供增值的信息服务。公众号根据适用场景和功能的区别,分为订阅号、服务号和企业号三种类型,根据腾讯企鹅智酷发布的报告显示,目前微信公众平台已拥有超过1000万个公众号。[6]受益于微信的高渗透率和海量用户,微信公众号在推出之后迎来了快速发展,同时借助微信开放平台提供丰富的编程接口可以实现与外部系统对接,从而实现微信用户身份绑定、支付、卡券以及一系列高级功能,具有良好的可扩展性,已成为政府和企事业单位开展对外宣传和服务的重要渠道。
2.微信小程序
为了进一步发挥微信的优势,2017年1月微信推出了“小程序”功能,目标是通过轻量化应用来支持丰富的场景化服务。微信小程序的主要入口是线下的二维码,其次才是公众号推送或朋友分享,因此它适用于刚需低频、随机应用、媒体形态的移动互联网方面。典型的应用场景包括:活动(抽奖)、硬件(自助打印照片)、快递(扫码收件)、理财(信用卡小程序)、住房(租房或者购房信息查询)、景区(线路导航、景点解说)、政务(查公积金、车辆违章、预约办证)、阅读(户外广告展示、信息推送)以及交通(微信乘车码支持乘坐公交和地铁)等。随着微信小程序的普及,微信进一步从“即时通讯工具”转变成“生活服务平台”。
微信小程序具有以下几方面特点:首先,微信小程序是一种全新的连接用户与服务的方式,融入微信生态体系,与微信公众号、微信支付、微信卡券等对接,它可以在微信内被便捷地获取和传播,同时具有出色的使用体验;其次,微信小程序嵌入于微信之中、不需要下载安装即可使用,具备无需安装、触手可及、用完即走、无须卸载的特性;第三,微信小程序相较于原生APP,推广更容易,更省成本;最后,微信小程序可以实现高效开发,借助微信平台提供的接口快速实现小程序投放使用,效益显著。
由于微信小程序面向场景化服务的定位及其特点,本文选择基于微信小程序设计实现签到系统,而不是基于微信公众号。
三、基于微信小程序的签到系统设计
1.签到系统功能模块
基于微信小程序的签到系统主要由三部分组成,分别包括签到管理模块、发布到微信里的签到小程序以及用于实现用户签到的前端展示界面。
(1)签到管理模块
签到管理模块用于实现会议活动的创建、通知、授权和统计等管理功能,如表1所示。
签到管理模块由经授权的管理员用户进行管理操作。
会议活动管理功能主要是创建会议活动,填写会议主题、议程、活动内容;设置活动所属类型;设定会议地点,包括GPS定位、所在建筑物、详细地址等;添加参会人员及工作人员;设置是否显示完整的参会人员名单、是否公开会议(在小程序中对非受邀人员可见)和是否允许非受邀人员参加会议。
活动通知设置是为方便会议通知发送,设置在何时通过何方式将会议活动信息发送给受邀的参会人员,目前支持通过微信公众号的模板消息推送、手机短信推送和电子邮件通知等。
统计输出功能是导出参会人员名单(含签到时间),可导出为excel;活动出席信息统计,如应到、实到、迟到;签到信息屏幕显示,呈现出会议动态二维码(包含会议活动信息,供参会人员扫码签到),以及签到情况统计。以便在开会时,通过台式电脑或平板电脑呈现二维码供用户扫描。
授权管理功能用于对会议管理员和签到操作员进行权限设置,不同的用户只能管理自己创建的活动。
(2)签到小程序
签到小程序是基于微信小程序开发的小程序应用,服务于参会人员和签到操作员。为便于身份识别,小程序可与微信公众号进行关联,并通过微信公众号用户身份绑定来识别签到用户实际对应校内师生身份信息。微信簽到小程序通过扫描动态二维码的方式实现签到,同时支持参会人员扫描会议现场的会议动态二维码,或由签到操作员使用小程序扫描参会人员的个人动态二维码。
面向参会人员的微信签到小程序主界面显示用户头像、用户名、身份类型(教职工或学生)、当前GPS定位地址等基础信息,同时提供信息筛选、会议列表及会议议程查看、签到记录查看、个人动态二维码、扫码签到等功能。参会人员在打开暨南大学签到小程序后,列表里会出现自己待出席的会议及当前位置附近的待开会议;程序自动获取用户当前位置;识别用户教职工或学生身份。筛选功能可根据时间、校区、距离范围及会议类别多维度地筛选会议。签到记录显示用户被邀请会议的列表以及本人的签到状态。个人二维码可以供现场的签到操作员扫码完成签到。或是打开扫码签到功能扫描现场的会议二维码,从而实现签到。点击进入某场会议,可以浏览到会议的议程及详细内容。
面向签到操作员的微信签到小程序界面除了上述参会人员具备的基本功能之外,还具备一个操作员功能,签到操作员可通过该功能在会议现场提供签到服务。签到操作员进入微信签到小程序后,点击“操作员”功能图标,可以进入本人具备管理权限的会议列表。然后选择某场会议,点击进入可浏览到会议的议程、详细介绍、参会人员的签到统计情况。同时,操作员可以点击二维码功能展示一张动态更新的会议二维码,供参会人员扫码签到;也可点击“扫码签到”功能调用手机摄像头作为扫描器扫描参会人员的个人动态二维码实现签到;针对部分特殊用户(未携带智能手机或签到操作失误),操作员还可以手动修改参会人员的状态。
(3)签到终端设备展示
为提升微信小程序签到系统的适用场景和签到效率,除了可以由签到操作员展示其微信小程序上的会议动态二维码供参会人员扫描签到,系统还设计实现了在会议现场部署签到终端设备来展示会议动态二维码的功能。
会议签到终端设备可以是固定的硬件终端或支持运行浏览器的各类智能终端设备,包括台式电脑、笔记本电脑、平板电脑和其他带屏幕显示功能的智能终端。该终端运行浏览器后访问签到系统,由签到操作员扫码登录并激活会议签到功能,即可以展现会议动态二维码供参会人员扫码完成签到,同时在该界面可展示实时签到人员统计信息。参会人员可通过个人微信“扫一扫”功能,或进入微信签到小程序后调用“扫码签到”功能进行扫码完成签到,签到完成后界面上会呈现当前签到用户的头像、姓名、教职工号或学号等个人信息予以确认。
2.签到系统角色及其功能权限划分
微信小程序签到系统主要包括三类角色,分别是会议管理员、签到操作员和参会人员,不同角色分别赋予不同的职能权限,如表2所示。
四、签到系统应用流程
基于微信小程序的签到系统应用流程包括会前管理,会议签到和会中、会后管理等环节。
1.会前管理
会前管理操作主要由会议管理员进行,操作内容包括创建会议活动、设置拟邀请参会的人员、设定会议签到操作员、配置会议签到的其他参数等。
首先,由管理员创建会议,确定会议名称、时间、地点,可精确到坐标;设置会议属性:是否公开可见,是否允许未受邀请的人员签到,是否允许未在微信公众号或小程序中绑定身份的用户(非暨南大学师生用户)签到(适用于部分对校外开放的会议活动),是否允许无需刷卡自动签到。
随后,管理员设定参会人员、批量导入和单个选择。导入的用户名单,如果已关注并绑定了“暨南大学”官方微信公众号,则在会议创建以及会议开始前分别收到一次微信消息推送;未绑定用户则会通过手机短信(SMS)和电子邮箱通知。
设定会议签到操作员,可负责现场签到工作。会议签到操作员进入自己的微信小程序选中当前会议,即可得到会议动态二维码,用于提供到场的参会人员扫码签到;或者由会议签到操作员通过其他设备运行浏览器访问会议签到前端界面,扫描会议签到管理二维码后即可激活会议签到功能,会议提供签到服务。
在会议设定生效后,受邀请的参会人员将会收到会议通知,通知方式包括微信公众号模板消息、手机短信和电子邮箱中的一种或多种。受邀请的参会人员可以登录微信签到小程序,选中本人待参加的会议,查看会议详细,并可以提交会议回执,表达本人将按时参会或请假等信息。
2.会议签到
会议开始前,会议签到操作员在现场可以提供以下两种不同的终端设备提供签到服务,第一种是签到操作员使用自己的智能手机并运行微信小程序,第二种是用会议现场的其他签到终端设备(包括固定的硬件终端或支持运行浏览器的各类智能终端设备)。在签到方式上也分别有两种签到方式:
第一种是参会人员发起扫码签到方式,先由签到操作员展示小程序上会议动态二维码,或现场签到终端展示会议动态二维码,然后由参会人员打开微信“扫一扫”功能或进入微信签到小程序调用扫码功能进行扫描签到。扫码成功后,签到系统进行有效性校验,并确认二维码对应人员身份,系统记录签到时间、人员信息,并在会议终端上呈现签到人员信息(用户头像、姓名),更新参会人员签到统计信息,更新动态二维码以便接受下一个参会人员扫码签到。详细流程如表3所示。
第二种方式是参会人员出示二维码被扫签到,即参会人员通过微信签到小程序出示个人动态二维码,由签到操作员持扫描设备扫描。扫码成功后,签到系统进行有效性校验,包括用户呈现的个人二维码是否合法;校验通过后,系统记录签到时间、人员信息,并在会议终端上呈现签到人员信息和签到统计信息。详细流程如表4所示。
在实际应用中,除了支持微信小程序签到,系统也兼容校园卡刷卡签到,以及特殊情况的手动签到方式。例如,个别参会人员因故未携带智能手机,或手机通讯受限无法登录微信小程序完成签到操作,此时可以先手写签到,再由签到操作员通过小程序代为手动签到,以完成签到工作。此外,若会议开启了基于LBS的自动签到功能,用户只需携带手机到达会场,便可以直接在微信签到小程序中点击完成签到,而不必依赖二维码签到。
3.会中管理
会议活动进行过程中,签到操作员可以在其微信小程序中的签到管理模块查看当前会议活动已签到人数统计及明细人员清单,清晰掌握会议签到情况。此外,在会议进行过程中,管理员还可以根据实际需要对会议信息进行调整,如延长或缩短会议时长、发布会议动态通知等。
4.会后管理
在会议结束后,管理员或会议操作员可以登录签到系统后台,查看会议签到统计报表,并导出签到明细清单,包括统计数据和人员清单等详细信息。此外,管理员还可以通过后台查询指定用户在某一时间段内出席会议的情况,或对某一时间段内不同会议活动的参会情况进行分析比较。这些分析结果可为进一步优化会议安排,提升工作效率提供有益的数据支撑。
五、微信小程序签到系统关键技术
基于微信小程序的签到系统充分应用了移动互联网和微信的特点,使其在应用中体现出便捷和智能的优势,以下对该系统的关键技术要点进行分析。
1.签到人身份识别与鉴定
在过去,签到系统的一个巨大挑战是签到人员的身份鉴别问题,例如手写签到潦草而无法准确识别、校园卡刷卡签到经常出现代签到等。因此,在设计和实现微信小程序签到系统时,着重解决身份鉴别问题,快速识别当前用户身份,并进一步鉴别当前签到人是否本人以避免代签到以及异地签到的情况。由于微信小程序签到系统中,签到流程主要围绕“动态二维码”(包括参会人员的个人动态二维码和会议动态二维码)这一媒介开展,因此科学设计二维码是身份鉴别工作的重点。[7]
(1)参会人员身份绑定与识别
由于参会人员通过微信小程序展示个人动态二维码或扫描会议动态二维码,为了能够识别用户,必须满足一个前提条件,也就是用户必需关注与小程序关联的一个公众号(如在暨南大学,微信签到小程序绑定的是“暨南大学”官方微信公众号),并进行身份绑定(将用户微信号对应的OPENID与校内某一位教师或学生相对应),以便在签到环节中实现签到人员的身份认证。
因此,在签到流程中,增加了一个判断用户是否已關注公众号并完成身份绑定的前置流程,如图1所示。以微信签到小程序在暨南大学应用为例,当用户启动微信小程序进行扫码时,若当前微信号未关注“暨南大学”官方微信公众号,则会出现关注界面,确认关注后进行身份绑定。对于已关注官方微信公众号的用户,则弹出登录框供用户输入校内师生合法用户名及密码进行校内师生身份绑定,以便实现签到人员的身份识别。
参会人员在完成公众号关注和校内师生身份绑定后,即可正常进行扫码签到操作。参会人员在签到时,只需要上报自己身份标识(学工号),系统后台将通过用户账号绑定关系识别当前用户真实身份,进而确定当前发起扫码签到操作的用户身份是学生还是教师,其学工号是多少。
(2)基于增强型TOTP动态密码机制的身份鉴别
通过用户在小程序关联的微信公众号进行身份绑定后,可以获得当前扫码用户的真实身份。然而,对于部分严格限定受邀请者本人参加的活动,扫码签到业务仍存在防盗刷(代签到)和异地签到的挑战,因此,在本系统中采用增强型TOTP动态密码(基于时间的一次性密码)机制,融合个人身份、时间戳、GPS位置参数和随机令牌的方式生成动态二维码,以此来增强系统的安全性,准确鉴别当前用户个人二维码的有效性,实现防盗刷的功能。[8]
增强型TOTP动态密码机制的身份鉴别流程如图2所示。首先进行参会人员身份有效性检查,系统通过调用学校数据中心接口,核验该学工号是否真实存在,同时在部分限制仅受邀人员能签到的会议中,增加判断当前用户是否在邀请列表中。其次进行会议地点匹配,签到者签到时,必须处在指定的地点(GPS经纬度范围设置,范围偏差不得超过正常设备定位偏差),并将该GPS地址与会议设定的会场GPS地址进行比对。第三步是时间匹配。会议签到有确定的时间,只有在会议开始前半小时和会议结束前才能正常签到;同时,对比二维码传递参数中的时间戳与当前服务器时间对比,若间隔超过60秒即判定为超时无效。第四步是判断传递的动态token是否与服务器端生成并分发给用户的token值一致,并校验token是否在有效期内。通过以上四个环节的判断,则可以确认当前签到人员所出示的二维码是合法有效的,完成签到工作,并给出签到成功的提示。
2.基于LBS实现信息推送及签到服务
基于位置的服务(Location Based Service,LBS)是移动互联网所提供的特色服务。在基于微信小程序的签到系统中,也实现了LBS的智能服务,主要应用于两个方面。
首先是“智能行程”。管理员在创建会议活动时,设置活动的地点和GPS坐标,便可以让用户端的签到小程序根据当前用户所在地点和所处的时间,显示相应的会议提示,包括:基于位置的会议推荐,系统会根据用户当前所在位置(GPS定位),推送附近即将开始的活动(会议);如果用户在受邀行列,该活动会优先排在前面。
其次是“智能签到”。部分较为宽松的活动,管理员可设定该活动启用基于位置的开放式签到功能。只需要参加该会议活动的人员在活动进行期间,在会场范围内出现,即可进入小程序点击“签到”按钮,完成签到,无需扫描二维码,从而显著提高签到效率。
3.支持多应用场景的签到服务
为适应在实际应用中的不同场景,基于微信小程序的签到系统还考虑了多场景签到服务。
(1)良好的签到终端设备兼容性
参会人员发起扫码签到方式时,会议活动主办方需要解决的是在会议入口提供会议动态二维码供用户扫描。在本系统中,会议动态二维码可通过签到操作员的微信小程序或独立的Web浏览器访问签到网址来呈现。因此,现场只需要任何一款可以运行Web浏览器并访问签到系统的终端设备(电脑、平板和手机)即可提供签到服务。
(2)向第三方设备或应用提供签到API
为进一步兼容高校原有的刷校园卡签到模式,并支持可能出现的其他新应用,系统开发了签到API供第三方设备和应用调用完成签到。在该模式的支持下,现有校园卡签到终端可以方便地接入集成到微信小程序签到系统中。
(3)支持多种签到方式
根据会议活动的实际需要,可以灵活组合指定签到方式,支持的签到方式包括主动扫一扫二维码、提供签到小程序二维码被扫、校园卡刷卡、工作人员输入学工号进行手动签到等方式。
六、总结及展望
本文结合微信小程序和LBS、TOTP技术,提出了一种在移动互联网上基于微信小程序的签到系统,并对该系统的各个模块和功能都进行了详细的说明,深入分析了系统的关键技术,包括签到人的身份鉴别、基于LBS实现信息推送及服务和支持多应用场景的签到服务。目前,暨南大学已经在官方微信小程序“暨南大学+”中上线该签到系统,并通过将小程序与暨南大学官方微信公众号关联实现用户身份绑定。
在实际应用中,基于微信小程序的签到系统展现了以下优点:①基于微信小程序便可接收会议提示,并完成签到,无需额外安装独立APP,且小程序入口较为便捷易用,深受用户欢迎,降低新服务的推广成本;②围绕动态二维码设计的签到系统,较好地解决了其他签到方式难以杜绝的“代签到”和异地签到等难题,准确地鉴别用户身份;③微信小程序及公众号提供了丰富的开放接口,使高校可以快速开发实现功能强大的移动互联网服务,有效节省开发成本;④系统提供了丰富的管理功能,實现签到及管理全流程优化,有效提升了参会和办会体验,提升工作效率;⑤系统提供了较好的兼容和扩展性,从而可以适应多种场景和新增需求。
总体来看,基于微信小程序的签到系统能较好地满足高校应用需求。同时,随着签到系统应用的深入,伴随着更多新技术的成熟,未来将重点在以下方面加以完善:①增加基于人脸识别的自动签到;②丰富会议管理功能,可由管理员共享会议文档,方便参会人员阅读,节省会议纸张,主要应用于学术、行政会议;③开放举手提问功能,参会人员可以在会议中发起提问,会议主持人可以从收到的问题中选择部分进行现场互动,主要应用于课堂、讲座;④开放评论互动功能,参会人员发布评论信息,现场可以用大屏幕投影,活跃现场气氛,主要应用于开放式活动;⑤增加会议直播和点播回放功能,未能现场参会的用户可以收看直播或会后点播。
参考文献:
[1]田丽,张巍,刘春瑞.校园一卡通会议签到系统的应用[J].计算机时代,2016(1):22-24.
[2]梁思丽.现代信息技术在中等职业教育教学中的应用——基于微信的课堂签到系统的实现[J].赤子(上中旬),2016(15):179.
[3]李光耀,张笑言,许晓华.基于微信的扫码签到系统的设计与实现[J].教育教学论坛,2017(12):66-67.
[4]第39次《中国互联网络发展状况统计报告》[EB/OL].http://www.cnnic.cn/hlwfzyj/hlwxzbg/hlwtjbg/201701/P020170123364672657408.pdf.
[5]腾讯公布2017年第三季度业绩[EB/OL]. https://www.tencent.com/zh-cn/articles/8003451510737482.pdf.
[6]微信2017用户研究和商业机会洞察[EB/OL]. http://tech.qq.com/a/20170424/004233.htm.
[7]曹记东,和斌涛.二维码加密的手机签到系统设计[J].无线互联科技,2016(5):44-45.
[8]赵建勋.基于TOTP的Web改进认证[J].计算机系统应用,2015(9).
(编辑:王天鹏)