基于微信小程序的学生考勤系统的设计与实现

刘琼， 史诺， 刘康

(西安航空学院, 1.计算机学院;2.机械工程学院， 陕西,西安 710077)

0 引言

目前，大部分高校仍采用传统课堂考勤方式，由教师口头点名并手写记录学生的到课情况。这种考勤方式占用了大量的课堂时间，影响了教学计划和进度，同时，依靠教师人工对考勤数据进行统计，效率低下而且很容易出现偏差。一部分高校也采用了智能考勤技术来解决传统课堂考勤的问题，如射频技术[1]、指纹识别、人脸识别[2-4]、蓝牙技术[5]等。其中，射频技术的效率和准确率较高，但前期投入基站的成本大，学生必须携带卡片，存在替签、代签等问题，教师需要在现场对学生进行监督；指纹识别和人脸识别技术，学生无需携带认证设备，对技术要求较高，无法保证100%的准确率，同时，设备成本高，管理费时费力、管理效率低下[6]。

针对当前常用的学生考勤技术存在替签、代签和管理效率不高的问题，本文以西安航空学院计算机学院计算机科学与技术专业《高级语言程序设计》课程教学考勤为研究对象，设计并实现了一个基于微信小程序的学生考勤系统。本系统采用Struts+Spring+Hibernate开发框架，前端采用微信小程序开发技术，后端采用JavaEE开发相关技术，位置信息的获取采用微信小程序提供的wx.getLocation(object)函数，数据的存储选用MySQL8.0数据库。

1 系统总体设计

学生考勤系统的用户为学生、教师和系统管理员，主要包括：在线考勤、手动考勤、考勤查询、考勤统计等功能，系统功能模块图如图1所示。

图1 学生考勤系统的功能模块图

1.1 在线考勤

在线考勤模块主要用于教师对考勤信息的发布、学生在线签到、学生定位签到等。

教师登录系统后，可以发布考勤信息，其中包括：考勤科目、考勤班级、考勤时长(超过此时间视为迟到)、考勤开始时间、学生与教师的地理位置距离差(需要开启位置服务)等。教师可以根据实际情况选择在线签到或者定位签到方式。其中，在线签到方式会生成课堂二维码由学生扫描，定位签到方式会对教师的地理位置进行定位。

学生收到教师发送的“在线签到”方式的考勤信息后，通过手机摄像头扫描课程二维码，实现对相应课程的在线签到。学生如果收到的是“定位签到”方式，则需要开启位置服务，系统会计算教师和学生的距离信息，当距离小于允许的范围(该范围由教师填写)时，学生签到成功。

1.2 手动考勤

手动考勤模块分为请假申请、请假审批和异常考勤三部分。

当学生遇到特殊情况需要请假时，对签到课程提交请假申请，由教师进行请假审批，审批结果为：拒绝或同意两种情况。当教师对学生的请假审批同意后，学生签到成功，该学生的考勤信息显示为正常；当教师拒绝后，学生签到为异常考勤。

异常考勤用于将各种考勤异常状况通知学生或教师，如学生请假被拒绝、在线签到失败、定位签到失败、未签到等情形，由教师通过搜索学生学号或姓名查询此学生信息，并手动为学生添加考勤信息。

1.3 考勤查询与统计

教师或学生可以对考勤信息进行查询，教师可以对考勤信息进行分类统计。

学生可以根据学号或姓名在系统查看自己的所有考勤历史信息。

教师可以以学生个人或班级为单位，从多维度查询某学期自己任教科目的在线签到信息、定位签到信息、请假信息和异常考勤信息等；教师也可以对各项考勤信息进行分类统计，掌握学生个人或班级的总体考勤情况，并将详细的考勤统计数据导出。

1.4 用户数据管理

用户数据管理模块主要用于管理用户信息。为了保证系统的安全性，用户信息由管理员以Excel形式上传。教师和学生用户凭借管理员所提供的账号和密码(与校园统一认证平台一致)登录系统，登录成功后，可以对个人信息进行修改。

2 技术架构

本系统前端使用微信小程序开发相关技术，包括WXML+WXSS+JavaScript，其中，WXML用来描述系统页面结构，WXSS用了描述页面的样式和页面的显示，JavaScript用来响应页面交互事件，进行逻辑处理。后端采用JavaEE开发相关技术，用来对前端发来的数据和请求进行处理，并对数据库进行操作。数据库采用MySQL8.0，用来存储用户的基本信息、学生的签到信息、签到打卡记录等。

3 系统详细设计与实现

3.1 考勤信息发布

教师根据自己的账号和密码登录系统后，显示本人当前任教的所有班级信息，教师可以选择某一授课班级发布考勤信息。考勤信息发布界面如图2所示。教师发布定位考勤信息界面如图3所示。

图2 教师发布考勤信息

图3 教师发布定位考勤信息

教师发布在线签到，需要设置考勤科目编号、考勤班级编号、考勤时长、考勤开始时间、二维码的宽度、高度信息，由系统自动生成对应的二维码用于考勤任务，为了防止学生替签、代签，二维码会定时自动刷新。

由于QRCode具有免费、支持中文、而且读取速度快、占用空间小的优点，故系统生成的签到二维码选择QRCode。签到二维码的生成需要引入wxapp.qrcode.min.js文件，调用createQRcode(canvasWidth,canvasHeight,canvasId,url)函数，其中，需要传递的参数分别表示：宽度、高度、ID号、地址链接。生成的二维码使用img标签来展示图片的载体，并使用Base64存储图片的信息。为了使二维码可以跨界面传递，需要导入arale-qrcode库，根据传入二维码链接生成svg或table形式的dom节点，通过Window.btoa()方法将svg字符转成Base64格式，二次转码字符串作为URI组件进行编码和解码。

教师发布定位签到后，由系统对教师进行定位。定位签到的过程为：申请开发者密钥(key)，开启WebServiceAPI服务，设置request合法域名，调用wx.getLocation(Object object)获取当前地理位置的经度和纬度。

3.2 学生在线签到

学生接收到教师发布的在线考勤任务后，点击“扫一扫”按钮，系统会调用手机摄像头，对教师发布的二维码进行扫描。签到具体流程为：学生通过扫描二维码，调用小程序wx.scanCode接口，获得解码信息；再在success接口里调用request接口，将二维码信息发送给服务器端，并将识别后的结果与数据库中的二维码进行匹配，如果匹配成功，并且签到时间在教师设置的打卡时长范围内，则在学生签到记录表中添加一条签到成功数据，签到结果如图4所示。

图4 在线签到成功

3.3 学生定位签到

学生接收到教师发布的定位打卡签到任务后，系统首先将发布此次考勤任务的教师的地理位置在腾讯地图上进行标注；然后计算教师的地理位置与学生打卡的地理位置之间的距离，并将求出的距离与教师之前的设置的允许的范围进行对比，如果小于教师设置的值，则认为学生签到成功，反之则视为异常签到，并将签到结果记录在日常定位签到记录表中。定位签到流程如图5所示。

图5 定位签到

计算距离的核心代码如下：

//lng1、lng2分别表示教师和学生位置的经度信息；

// lat1、lat2分别表示教师和学生位置的维度信息

var rad1 = lat1 * Math.PI / 180.0;

var rad2 = lat2 * Math.PI / 180.0;

var a = rad1 - rad2;

var b = lng1 * Math.PI / 180.0 - lng2 * Math.PI / 180.0;

var r = 6378137;

var distance = r * 2 * Math.asin(Math.sqrt(Math.pow(Math.sin(a / 2), 2) + Math.cos(rad1) * Math.cos(rad2) * Math.pow(Math.sin(b / 2), 2)));

3.4 手动考勤

手动考勤分为请假管理和异常考勤。当学生申请并提交请假信息后，系统将学生请假申请传递给教师，教师端会出现学生的请假申请，教师根据请假原因决定是否批准。教师审批请假后，系统会更新学生的考勤信息。请假审批如图6所示。

图6 请假审批

当学生手机出现故障或者无法准确进行定位打卡签到时，教师可以通过搜索学生学号或姓名进行考勤。

4 总结

本文针对现有学生考勤管理费时费力以及管理效率低下的问题，设计并实现了基于微信小程序的学生考勤管理系统，实现了教师考勤任务发布、学生在线签到、定位签到、手动考勤等功能，本系统无需下载安装即可使用，提高了考勤的准确性，并有效地保证了考勤率，为高校考勤管理的规范化提供解决思路。