在线考试中主观题答题信息录入方法研究

王 东,林 宏,向程冠

(1.贵州师范学院数学与大数据学院,贵州 贵阳 550018; 2.贵州师范学院教育信息网络中心,贵州 贵阳 550018)

0 引言

近年来,随着移动互联网技术的快速发展,在线考试已成为教育考试的一个发展趋势。相对于传统的纸笔考试,在线考试具有开放、高效、及时、便捷、经济、灵活和绿色低碳等优势。越来越多的考试放弃传统方式,转而使用在线考试的方式进行。然而,在线考试要得到更加广泛的应用与推广,仍有一些问题需要解决,其中,如何高效便捷的录入答题信息是在线考试需要解决的关键性问题。判断题、选择题等客观题型的答题很容易解决,而主观题的答题情况则比较复杂。有的主观题答题只需要输入文字,而有的试题需要绘图、制作表格、输写公式、给出推导演算过程等。很多在线考试平台并不能满足主观题如此多样化的答题需求,这极大限制了在线考试的广泛应用。一些学者和科研机构对在线考试平台建设做了深入的研究,主要集中在在线考试平台的框架搭建[1-2]、组卷算法[3-5]、自动评分[6-7]等,并取得了不同程度的进展。对于在线考试平台中主观题答题信息录入方法的研究,在中国知网里进行搜索,未找到以该主题发表的相关文献。本文就此展开研究,在自研的在线考试平台中实现了四种主观题答题信息录入方法,为在线考试平台的进一步发展提供参考。

1 基于增强富文本编辑器的主观题答题信息录入

主观题答题信息录入的常规方法是使用富文本编辑器。这种方法能录入文本数据,支持简单表格的制作,能满足文字类型试题的答题需求。文史专业中许多课程属于此类。对于理工类专业中的许多课程考试,很多试题在答题时不仅要录入文字,还要录入公式或者绘制图表。这种情况下,可以扩展富文本编辑器的功能,使其具备一定的公式编辑、图表绘制能力。

1.1 设计与实现

主流的富文本编辑器有ueditor、ckeditor、FreeTextBox等。在页面中引入编辑器需要的配置文件、加载编辑器的容器、实例化编辑器后,就可以使用编辑器输入文本和简单表格数据。

1.1.1 集成公式编辑器

要让编辑器具备公式编辑的能力,可以集成专门的公式插件。以ueditor富文本编辑器为例,在ueditor中集成kityformula公式插件的步骤为:

步骤1 下载 kityformula公式插件,放置到ueditor目录中。

步骤2 在需要集成的页面中引用公式插件的主要js文件。

步骤3 修改ueditor的配置文件ueditor.config.js,在toolbars中增加工具项′kityformula′。

1.1.2 集成绘图插件

在编辑器中集成作图插件后,可以扩展编辑器的在线绘图功能。jSignature是一个通过捕捉笔画的矢量轮廓输出多种格式数据的插件,可以实现绘画板、手写签名等功能。在ueditor编辑器中集成该插件的步骤为:

步骤1 修改ueditor的配置文件ueditor.config.js,在toolbars项中增加自定义工具项′photo′,通过该工具按钮打开在线绘图页面。

步骤2 在绘图页面中引入jSignature的配置文件及插件容器。绘图页面用于显示绘图区,绘图后提交数据到后端处理。

步骤3 后端处理程序接收绘图数据并进行解析,生成图片文件。

1.2 利弊分析

基于富文本编辑器的答题信息录入方法实现简单,主要弊端是不支持复杂数据录入。要解决这一弊端,一方面可以将公式插件集成到富文本编辑器中,增加公式编辑能力,但需要在考试前掌握公式插件的使用方法;另一方面可以将绘图插件集成到富文本编辑器中,实现简单的在线绘图功能,但使用鼠标绘图,操作极为不便,对答题速度影响较大。

2 基于高拍仪的主观题答题信息录入

高拍仪是一种便携低碳的办公用品,能快速采集文档、证件、票据的图片。大部分高拍仪都提供了软件开发工具包SDK(Software Development Kit),可以将高拍仪集成到第三方系统中进行图像操作,比如预览、拍照、纠偏裁剪、图片上传等。通过SDK提供的 JavaScript API,可以在浏览器里轻松地从USB捕捉图像。使用高拍仪提供的Web开发控件,只需几行JavaScript代码即可在网页程序中抓取文档图片并进行在线图片编辑、上传等功能。本文将高拍仪集成到在线考试平台中,考试时为每台考试机配置一台高拍仪,考生先将答题信息用笔写在答题纸上,再用高拍仪拍照上传到在线考试平台中。

2.1 设计与实现

步骤1 制作一个页面,放置3个按钮,用于打开高拍仪摄像头、关闭高拍仪摄像头和执行拍摄命令,如图1所示。

图1 在线考试平台集成高拍仪

步骤2 在页面Page_Load事件中随机生成一个图片文件名filename。

步骤3 在页面加载后启动轮询请求,异步查询服务器指定位置是否存在图片文件filename。如果请求成功,表明已经拍摄成功,关闭高拍仪摄像头。

步骤4 执行打开高拍仪摄像头命令StartVideo(),启动高拍仪插件拍摄预览界面,将答题纸置于高拍仪下,根据预览图片适当调整答题纸位置。

步骤5 执行拍摄命令CaptureImage(),插件拍摄图片,将图片编码成Base64编码格式的字符串imgBase64。

步骤6 使用$.post方法将imgBase64提交给后端处理程序进行处理,在请求成功的回调函数中关闭高拍仪。

步骤7 后端处理程序接收imgBase64并进行解析,生成图片文件。主要代码如下:

1)Dim Base64 As String = context.Request.Params("Base64")

2)Dim contents() As Byte = Convert.FromBase64String(Base64) ′获取图片二进制数组

3)Dim outPath As String = context.Server.MapPath(filename)

4)Dim fs As FileStream = New FileStream(outPath, FileMode.Create, FileAccess.Write)

5)fs.Write(contents, 0, contents.Length)

2.2 利弊分析

基于高拍仪的答题信息录入方法主要优点是实现简单,主要弊端是需要为每台考试机配置一台高拍仪,会增加机房建设成本。另外,机房在日常的大部分教学活动中不会使用高拍仪,如果固定安装会占用空间,考试时再临时安装又会增加管理难度。

3 基于移动终端拍照的主观题答题信息录入

移动电话现在已成为人手必备的通讯工具,其具有强大的拍摄功能,若设计得当,完全可以用于在线考试中主观题答题信息的采集设备。首先,主观题答题时,考生先将作答信息用笔写在答题纸上;其次,考生使用自己的手机扫描答题二维码,引导打开上传页面,使用手机拍照将答题纸的答案上传到答题富文本编辑器中;最后,对图片进行裁剪和旋转处理。图2为基于移动终端拍照的答题信息录入流程图。

图2 基于移动终端拍照的答题信息录入流程图

3.1 设计与实现

基于移动终端拍照的答题信息录入法主要步骤包括:生成二维码图片;考生扫描二维码,引导打开上传页面;拍摄答题纸并上传图片;服务端对上传的答题图片进行自动化处理;在线考试平台答题富文本编辑器中拉取显示答题图片。运行效果见图3、图4。详细设计与实现过程如下:

图3 扫码页面

图4 手机拍照上传页面

步骤1 在答题富文本编辑器上创建一个工具按钮,用于打开一个小窗口。在小窗口中生成并显示一个链接二维码,用于引导考生扫描打开上传页面。在生成链接二维码时,同时生成一个时间戳字符串作为链接参数,在打开上传页面时可以获取该参数。

步骤2 二维码一旦生成并显示,答题页便对服务端发起异步轮询请求,检测服务端指定位置是否存在以时间戳字符串命名的图片文件。如果检测成功,将图片文件拉取插入到答题富文本编辑器中显示。

步骤3 当链接二维码显示时,考生使用自带的手机扫描二维码打开上传页面。执行该操作时会自动提取出链接地址中的时间戳参数,与数据库中存储的时间戳进行对比。若数据库中未检索到相关记录,或者记录创建时间超过设定阈值,则表示异常情况,不允许上传图片,否则等待考生执行上传操作。

步骤4 上传组件使用bootstrap fileupload,单击上传组件的拍摄按钮,可调用手机自身的拍照功能进行拍照。然后再执行上传命令。在上传之前,组件还可以设置图片压缩比例,因为手机拍摄的照片通常分辨率很大,压缩后再上传能加快传输速度。

步骤5 服务端接收图片,对图片进行合法性检验。第一是检查上传者是否为合法用户;第二是检查用户扫描二维码的时间与当前时间的关系,对超过设定阈值给予异常提示,防止过长操作时间;第三是检查上传图片是否为拍摄照片,对非拍摄照片给予异常提示;第四是检查拍摄照片时间与当前时间的关系,对超过设定阈值给予异常提示,防止考生使用提前准备好的图片作弊。

步骤6 将图片以时间戳字符串命名,存储到指定位置,以便答题页面发出的异步轮询请求检测。最后清除数据库中存储的时间戳,防止重复上传。

答题信息拍摄上传成功后,由于手机拍摄的答题信息中包含无效区域,考生还需要对图片进行裁剪。如果图片方向颠倒,还需要对图片进行旋转处理。

(1)裁剪无效区域

对答案图片进行裁剪处理的主要步骤包括:

1)通过矩形框定位答案图片的有效区域,获取有效区域左上角的坐标、长度和宽度;

2)将获取的有效区域作为参数传递到服务端,服务端执行裁剪处理;

3)前端刷新显示裁剪后的新图片。

(2)图片旋转处理

对答案图片进行旋转处理的主要步骤包括:

,请求成功的回调函数中刷新图片;

3.2 防作弊措施

一般情况下,考试时为了防止考生利用手机作弊,是不允许考生携带和使用手机的。如果要让考生使用手机拍照上传答题信息,则必须设计相应的措施防止作弊行为。具体措施包括:

(1)将允许考生扫码上传的时间限定在考试结束前一定时限内,该时限外禁用扫码上传功能,同时规定允许扫码上传的时限外不能使用手机。

(2)允许扫码上传的时限内禁用客观题答题功能。

(3)使用专用答题纸,拍摄的答题信息中必须包含考生签名,该措施不仅能防止学生事先将答案写在纸上带入考场,也能防止使用他人拍摄的图片。

(4)自动检测图片的原始拍摄时间,禁止上传规定时限外拍摄的图片。该措施可防止使用非手机拍摄的图片,也可防止使用事先拍摄存储在手机内的图片。

3.3 利弊分析

基于移动终端拍照的主观题答题信息录入方法借助用户自持的手机设备,可解决机房安装图像采集设备成本过高的问题。该方法在电脑端生成试题二维码,考生用手机扫码、拍照,上传图片。电脑端自动接收图片,插入富文本编辑器中。当主观题答题时,考生使用纸笔作答,无论是文字、图表、公式、推导演算过程等书写都不受限。

该方法的主要问题是要在考试过程中使用手机,这与传统考试规定相违背,需要对相关考试制度进行修改。虽然可以通过技术和制度等措施防范考试作弊行为,但仍然会增加一定的作弊风险。

4 基于高速扫描仪的主观题答题信息录入

基于高速扫描仪的答题信息录入是一种线上、线下相结合的考试方式。即:客观题线上作答,而主观题采用纸笔作答,考试结束后再对答题卡进行扫描、切割处理。该方法的关键环节是要实现主观题答题卡制作、答题区域标记和答题区域切割。

4.1 主观题答题卡制作

为了实现答题区域的自动切割,主观题答题卡必须要统一制作。纸张的选择与传统纸笔考试一样,选择60g以上、A4幅面的普通复印纸。达到这个要求的纸张,双面作答也能扫描得到清晰的答卷图片。答题卡设计上,主要由表头区、页眉、页脚、主观题答题区几部分构成。表头区主要包含考试基本信息和学号填涂栏;页眉居中呈现页码;页脚在两端对称放置两个黑色正方块作为定位点,它的作用是对扫描图像进行倾斜矫正;主观题答题区包括试题描述及答题框,学生的答题信息书写在答题框内。答题卡如图5所示:

图5 答题卡

4.2 答题区域标记

答题区域标记就是要在样卷上标记出每道题的答题区域切割边界。为了保证系统的易用性,标记过程应设计得足够简单,仅需在样卷图片的答题区域边界上用鼠标拖画出一个矩形框就可完成区域标记,在此过程中自动采集到各区域边界的坐标与尺寸。

4.3 答题区域切割

在标记答题区域后,只需将扫描获得的答题卡图片压缩成包上传服务器,系统自动完成解压,识别每张答题卡的学号信息,根据两个定位点中心点坐标的夹角进行图片倾斜矫正,对答题区域进行自动切割处理。

(1)图像倾斜矫正的实现

答题卡在扫描过程中,少数扫描图片会出现倾斜现象,这不仅影响答题卡学号填涂栏的正确识别,也会对区域切割产生一定影响,因此需要对图片进行自动矫正[8-9]。首先识别出图片底部的两个定位点,计算出两个定位点中心坐标,再计算出旋转角度,使用cv2.getRotationMatrix2D旋转角度和位移来计算变换矩阵,最后使用cv2.warpAffine()函数利用变换矩阵M对图像进行旋转。算法描述如下:

算法1 图像倾斜矫正

输入:原始图片imgpath,均值滤波器尺寸ksize,阈值分割的阈值thresh。

输出:矫正后的图片imgpath

1) Dim source0 As Mat = New Mat(imgpath, ImreadModes.Grayscale) ′载入原始图像

′声明定位点区域范围

2) Dim roi As Rect = New Rect(xvalue, yvalue, wvalue, hvalue)

3) Dim ImageROI As Mat = New Mat(source1, roi) ′加载roi内的图像

4) Cv2.Blur(ImageROI, source2, New OpenCvSharp.Size(ksize, ksize)) ′均值滤波

5) Dim source3 As Mat = source2.Threshold(thresh, 255, ThresholdTypes.BinaryInv) ′阈值分割

6) Cv2.FindContours(source3, contours, r2, RetrievalModes.External, ContourApproximationModes.ApproxNone)′获取轮廓

7) For i As Integer = 0 To contours.Length - 1′循环处理每个轮廓

8) Dim Rect As OpenCvSharp.Rect = Cv2.BoundingRect(contours(i)) ′包裹轮廓的最小正矩形

9)′计算高度与宽度比值

10) Dim rd As Double = IIF(Rect.Width >Rect.Heigh,Rect.Height/Rect.Width, Rect.Width/Rect.Height )

11) If rd >0.9 Then′提取近似正方形的轮廓

12) Yrect.Add(Rect)

13) End If

14) Next

15) Yrect.Sort(newsCompare1)′根据x坐标排序

16) ′左定位点中心点坐标

17) Dim x1 As Integer= Yrect(0).x + Int(Yrect(0).w / 2)

18) Dim y1 As Integer= Yrect(0).y + Int(Yrect(0).h / 2)

19) ′右定位点中心点坐标

20) Dim x2 As Integer= Yrect(1).x + Int(Yrect(1).w / 2)

21) Dim y2 As Integer= Yrect(1).y + Int(Yrect(1).h / 2)

22) Dim k As Double=Math.Atan(ToDouble(y2-y1)/ ToDouble(x2 - x1))

23) Dim angle As Double= k*180.0/Cv2.PI ′ 计算夹角

24) Dim center As Point2f = New Point2f(source0.Cols / 2, source0.Rows / 2) ′图像中心点坐标

25) Dim M As Mat = Cv2.GetRotationMatrix2D(center, angle, 1) ′计算变换矩阵

26) Dim newsource As Mat = New Mat()

27) Cv2.WarpAffine(source0, newsource, M, source0.Size(), InterpolationFlags.Linear, BorderTypes.Constant) ′图像变换

28) Cv2.ImWrite(imgpath, newsource) ′保存变换后的图像

(2)学号填涂栏设计与自动识别

学号填涂栏共设置13列,少于13位学号按左对齐填涂。学号填涂栏右侧为10个黑色矩形方块,称为纵向定位头,用于对0到9填涂数字的纵坐标进行定位。填涂栏底部为两个黑色矩形方块,称为横向定位头,分别与填涂栏第一列和最后一列居中对齐,用于对每列的横坐标进行定位。学号填涂栏如图6所示。

图6 学号填涂栏

学号填涂识别的基本思路是:对每列内0到9各个填涂数字区域内的灰度值进行统计,计算填涂面积最大者为该列填涂结果,若某列的最大填涂面积低于设定的阈值,则认为该列没有填涂。算法描述如下:

算法2 学号填涂识别

输入:图片地址imgpath,均值滤波器尺寸ksize,阈值分割阈值thresh,填涂占比ratio。

输出:填涂字符串

1) Dim rectY As ArrayList ′存储横向定位头X坐标和宽度

2) Dim rectX As ArrayList ′存储纵向定位头Y坐标和高度

3) rectify(imgpath, ksize, thresh) ′倾斜校正

′获取横向定位头x坐标和宽度、纵向定位头y坐标和高度

4)GetLocCoordinate(imgpath, 10, ksize, thresh, rectX, rectY)

′载入图像

5) Dim source As Mat = New Mat(imgpath, ImreadModes.Grayscale)

6) Cv2.Blur(source, source1, New OpenCvSharp.Size(ksize, ksize)) ′均值滤波

7)Dim source2 As Mat = source1.Threshold(thresh, 255, ThresholdTypes.BinaryInv) ′阈值分割

8) Dim element As Mat = Cv2.GetStructuringElement(MorphShapes.Rect, New OpenCvSharp.Size(7, 7)) ′结构元

9) Cv2.MorphologyEx(source2, source1, MorphTypes.Open, element, Nothing, 2) ′形态学处理

10) For i As Integer = 0 To rectX.Count - 1′循环识别每一列的填涂项

11) Dim max As Integer = 0

12) Dim num As Integer = 0

13) For j As Integer= 0 To rectY.Count - 1 ′循环处理0-9

14) Dim rect3 As Rect = New Rect(rectX(i)(0), rectY(j)(0), rectX(i)(1), rectY(j)(1))′数字填涂区域

15) Dim tem As Mat = New Mat(source1, rect3)

16) Dim tem_count As Integer = Cv2.CountNonZero(tem) ′计算数字填涂区域非零像素点数

17) If (max

18)max = tem_count

19)num = j

20) End If

21) Next

22) fillarea= rectX(i)(1) * rectY(num)(1) * ratio′填涂阈值

23) XH+=IIf(max>fillarea, num.ToString,"#")′用#表示该列没有填涂

24) Next

25) Return XH

4.4 利弊分析

基于高速扫描仪的答题信息录入方法优点在于主观题的答题方式使用学生习惯的纸笔答题,支持各种题型,易于实施;主要弊端在于需要教师做一些额外的工作,如:统一制作答题卡,考试结束后要进行扫描,进行答题区域标记和切割等。

5 结论

一款优秀专业的在线考试平台应能同时满足不同专业、不同学科的考试需求,对不同类型主观题答题信息录入提供支持。如果不能支持丰富的题型,就难以使用高质量的试卷,也就不能全面测评考生的学习情况和教学质量。本文实现了四种主观题答题信息录入方法:基于增强富文本编辑器的答题信息录入方法使用简单,但对复杂数据信息录入支持有限,能满足哲学、法学、教育学、文学、历史学等以文本数据为主的考试;基于高拍仪的答题信息录入方法要求为每台考试机配置高拍仪设备,适用于硬件条件较好的小型考试;基于移动终端拍照的答题信息录入方法要在考试过程中使用手机,适用于课程作业、日常测试;基于高速扫描仪的答题信息录入方法将线上、线下考试相结合,能满足全学科、大型考试需求。总体上,每种方法都有其优势和不足之处,考试时可以根据具体情况进行选择。