張沈梅 孫昊 王玲 成甜甜 祖兆研

摘要：微信小程序是最近興起的一種程序開發(fā)和使用方式，將微信小程序和課程在線測試系統(tǒng)相結(jié)合，教師能夠在線管理試卷和考試，學生利用微信進入測試系統(tǒng)，查看錯題或進行課堂小測，考試提交后，教師獲得學生的成績。該應(yīng)用前端采用微信自定義組件和樣式，后臺采用Java語言編寫，使用Springboot和Mybatis框架搭建，前后端交互部分使用微信小程序定義的API。數(shù)據(jù)庫使用Mysql平臺和workbench圖形化界面，SQL語句構(gòu)建。

關(guān)鍵詞：微信小程序；在線測試系統(tǒng)；自定義組件

中圖分類號：TP399 文獻標識碼：A 文章編號：1009-3044（2018）32-0082-03

Abstract：Mini program in the Wechat is a newly developed method of developing and using the program， combining the Mini small program in the Wechat with the online test system of student achievement. Teachers can manage test papers and exams online. Students use WeChat to enter the test system， check the wrong examination questions or do a small test. After the examination is submitted， the teacher gets the students' achievements. This application used WeChats component and styles， the background is written by Java， used springboot and mybatis framework， and the interaction part of the front and back end uses the WeChat small program defined application program interface（API）. The database uses MySQL platform and workbench graphical interface， uses structed query language（SQL） statement construct.

Key words：Mini program in the Wechat；Online Test System；WeChats component

如今微信已是亞洲地區(qū)最大用戶群體的移動即時社交通信軟件，并且微信已不止社交這么簡單，它包含了生活、支付、娛樂、媒體等人們生活中經(jīng)常用到的多種服務(wù)。第一個微信小程序于2017年1月問世，便是利用微信官方提供的服務(wù)接口而生的最新的應(yīng)用技術(shù)。[1]微信的這項功能是開放申請的，無論是個人還是政府、媒體或其他組織都可以申請注冊并開發(fā)小程序，并且微信官方提供了一套專門的開發(fā)工具給開發(fā)者。微信的小程序和訂閱號、服務(wù)號和公眾號是并行體系，它們有些像，但又不一樣。微信之父張小龍表示：現(xiàn)在太多人做公眾號而非APP，于是導(dǎo)致現(xiàn)在微信公眾號變成了一個媒體化的平臺，但是我們的本意并非如此，我們想要提供服務(wù)而不是傳播推廣信息，于是就有了小程序。在手機應(yīng)用層出不窮且手機存儲能力有限的今天，微信小程序作為一種輕度云端應(yīng)用正好符合了目前人們的需求。根據(jù)微信官方的說法，小程序是一種不需要下載安裝即可使用的應(yīng)用，它實現(xiàn)了應(yīng)用“觸手可及”的夢想，用戶掃一掃或者搜一下即可打開應(yīng)用。[2]應(yīng)用將無處不在，隨時可用，但又無須安裝卸載?？梢哉f未來隨著網(wǎng)絡(luò)和云的發(fā)展，手機應(yīng)用程序?qū)⒉辉倬窒抻诒镜啬Ｊ?，而是逐漸向著云端體驗進化。[3]

關(guān)于在線測試系統(tǒng)，現(xiàn)在的教育方式趨于多元化，不再局限于教室內(nèi)面對面單一的教學。對學生成績的評定，也不僅僅用期末考試成績來衡量，平時成績和出勤率越來越受到學校的重視?；谖⑿判〕绦虻恼n程在線測試系統(tǒng)，方便老師迅速了解學生的學習情況，省去印刷試卷、批閱試卷、匯總成績這些人工工作；對學生來說，不必安裝應(yīng)用程序，通過微信就可以進行課程在線測試。

1 系統(tǒng)設(shè)計

在線測試系統(tǒng)分為教師和學生兩部分。除了基本的登錄功能，學生可以答題、查看以往做過的試卷的錯題。教師可以發(fā)布試卷考試、添加試卷、修改試卷題目以及查看學生成績。

1.1 總體設(shè)計

系統(tǒng)整體采用MVC分層，M是model模型層，與數(shù)據(jù)庫交互。V是view視圖層，將數(shù)據(jù)展示給用戶，與用戶進行交互。C是controller控制層，用于分發(fā)控制到來的請求，并調(diào)用模型層與數(shù)據(jù)庫進行交互，以及將數(shù)據(jù)返回給視圖層展示。[4]使用MVC分層實現(xiàn)功能很有優(yōu)勢，首先代碼會很清晰明了，方便開發(fā)和以后的維護。各個部分是松耦合的，更改一個層的代碼不會影響其他層的功能的實現(xiàn)。

微信小程序有專門的開發(fā)工具，在微信小程序的官方網(wǎng)站上即可下載，稱作微信web開發(fā)者工具。[5]小程序有專用的開發(fā)組件，這是微信官方自定義的，并且配有詳細的使用文檔，其語言為WXML和WXSS。WXML是微信的一套標簽語言，結(jié)合基礎(chǔ)組件、事件系統(tǒng)，可以構(gòu)建出頁面的結(jié)構(gòu)，WXSS具有CSS大部分的特性，小程序在WXSS也做了一些擴充和修改。[6]新增了尺寸單位，開發(fā)者需要考慮到手機設(shè)備的屏幕會有不同的寬度和設(shè)備像素比，采用一些技巧來換算一些像素單位。小程序底層還是基于Webview來實現(xiàn)的，整個框架體系，比較清晰和簡單，基于Web規(guī)范，采用HTML、CSS和JS等搭建的一套框架，只需了解框架規(guī)范即可使用已有Web技術(shù)進行開發(fā)。

編寫后臺使用Springboot和Mybatis框架。Springboot框架簡化新Spring應(yīng)用的初始搭建以及開發(fā)過程。該框架使用了特定的方式來進行配置，從而使開發(fā)人員不再需要定義樣板化的配置，簡化開發(fā)。MyBatis 是支持定制化 SQL、存儲過程以及高級映射的優(yōu)秀的持久層框架[7]，它消除了幾乎所有JDBC代碼和參數(shù)的手工設(shè)置以及結(jié)果集的檢索，主要設(shè)計目的就是讓我們對執(zhí)行SQL語句時對輸入輸出的數(shù)據(jù)管理更加方便，方便地寫出SQL和方便地獲取SQL的執(zhí)行結(jié)果，為開發(fā)人員減負[8]。

1.2 數(shù)據(jù)庫設(shè)計

在線測試系統(tǒng)數(shù)據(jù)庫基于MySQL數(shù)據(jù)庫建立，系統(tǒng)數(shù)據(jù)庫包含有選擇題表（choice）、填空題表（fillintheblank）、判斷題表（judge）、試卷表（paper）、題目試卷關(guān)聯(lián)表（papersubject）如表1所示、學生答案表（paperanswer）如表2所示、學生成績表（paperhistory）如表3所示、學生信息表（student）和教師信息表（teacher）。其中題目試卷關(guān)聯(lián)表、學生答案表、學生成績表為核心表格，其他的表格存放的皆為基礎(chǔ)信息。

2 詳細設(shè)計

進入小程序，首頁選擇學生登錄或教師登錄。選擇教師登錄后，教師輸入自己的工號和密碼，驗證成功后進入登錄后的頁面。教師可以選擇發(fā)布試卷、歷史考試結(jié)果、添加試卷和修改試卷功能。選擇發(fā)布試卷后，有兩個關(guān)聯(lián)列表，第一列選擇考試學生專業(yè)，第二列選擇試卷名稱。這樣對應(yīng)專業(yè)的學生即可看到發(fā)布過的試卷，發(fā)布成功后自動跳轉(zhuǎn)到教師登錄后的界面。選擇歷史考試結(jié)果，這里顯示了所有試卷的考試結(jié)果，點擊后可以看到學生的名字和對應(yīng)的考試成績。添加試卷時需要手動輸入考試科目和試卷名稱，提交后成功添加相應(yīng)試卷。修改試卷功能中，先選擇需要修改的試卷，點擊修改試卷后顯示該試卷的所有題目，教師可以選擇刪除相應(yīng)題目或添加題目，添加題目時須填寫題目相關(guān)信息，選擇題目類型：選擇、填空或判斷。

選擇學生登錄后，學生輸入自己的學號和密碼，驗證成功后進入登錄成功的頁面。學生選擇考試試卷，跳轉(zhuǎn)后看到需要考試的試卷，選擇相應(yīng)試卷，試卷內(nèi)容有三項：選擇、填空和判斷。學生在規(guī)定時間內(nèi)做完，可以選擇交卷，或者等到考試時間結(jié)束后自動交卷。交卷后跳轉(zhuǎn)到登錄后界面。學生選擇歷史考試后，跳轉(zhuǎn)到的頁面顯示出所有已經(jīng)答過的試卷，選擇相應(yīng)試卷后學生可以看到自己的錯題和試卷的分數(shù)。

2.1 登錄模塊

學生和教師登錄是不同的界面。學生登錄時，前端傳遞的參數(shù)為學生輸入的學號和密碼，后臺調(diào)用的是loginStu接口，接口將學號、密碼、類型：stu傳遞給服務(wù)方法login，該方法通過類型判斷為學生登錄。再進行判空、查詢用戶名密碼是否正確，最后將信息返回給前臺，前臺界面將信息顯示出來。

教師登錄實現(xiàn)與學生登錄相同，只不過后臺調(diào)用的是loginTea接口，所以類型為tea，服務(wù)方法為login，判斷為教師登錄。

2.2 試卷管理模塊

教師通過添加新試卷和對已有的試卷進行修改來管理試卷。

2.2.1 添加試卷

教師添加試卷功能頁面將考試科目和試卷名稱兩個參數(shù)傳遞給后臺的添加試卷接口（uppaper），在試卷表（paper）中添加一條數(shù)據(jù)即可。

2.2.2修改試卷

修改試卷功能需要教師先選擇要修改的試卷，該功能與發(fā)布試卷功能類似。選擇好要修改的試卷后，顯示出該試卷所有題目，教師可以選擇刪除某一題目，點擊刪除按鈕時調(diào)用后臺delete接口，傳遞參數(shù)為試卷名稱和該題目在該試卷中的題號，刪除在試卷題目關(guān)聯(lián)表（papersubject）中的數(shù)據(jù)即可。教師還可選擇為該試卷添加題目，傳遞參數(shù)為試卷名稱、題干、選項A、選項B、選項C、選項D、答案、題目類型，后臺調(diào)用修改試卷接口（alterpaper），根據(jù)題目類型判斷該將題目存放在選擇題表（choice）、填空題表（fillintheblank）還是判斷題表（judge）中。再將題目和題號對應(yīng)關(guān)系存進試卷題目關(guān)聯(lián)表（papersubject）中。

2.3 考試管理模塊

2.3.1 發(fā)布試卷

教師發(fā)布試卷的頁面在顯示前，先調(diào)用后臺接口查詢教師未發(fā)布過的試卷（queryUnpublished），選擇試卷表（paper）中的專業(yè)字段（subject）獲得數(shù)據(jù)庫中所有專業(yè)和對應(yīng)專業(yè)所包含的試卷，最后將所有查詢到的信息通過json數(shù)據(jù)傳回前端顯示。教師在界面選擇專業(yè)和試卷，傳遞的參數(shù)為試卷名稱，調(diào)用后臺發(fā)布接口（release），將試卷表（paper）中的狀態(tài)字段（state）從0改為1，則為已經(jīng)發(fā)布。

2.3.2 學生成績管理

成績頁面在顯示前，先調(diào)用后臺queryHistoryTea接口，將試卷表（paper）中狀態(tài)字段（state）為1（意為已發(fā)布）的試卷名稱返回給前臺并顯示。教師點擊試卷，前端跳轉(zhuǎn)并將試卷名稱同時發(fā)送給成績界面，成績界面在顯示前先將參數(shù)試卷名稱傳遞給后臺queryScoreTea接口，將paperhistory（存放學生成績和對應(yīng)學生id）表和student（學生基本信息）表通過學生id連接，并選擇相應(yīng)試卷名稱的學生姓名和學生成績返回前端界面并顯示。

2.3.3 學生答題

學生選擇要答的試卷，該頁面在顯示前調(diào)用后臺query接口，傳遞參數(shù)為學生id和學生專業(yè)。返回教師發(fā)布過且學生未答過的試卷名稱并顯示在頁面上。

學生選擇試卷后，頁面跳轉(zhuǎn)并將試卷名稱發(fā)送到答題界面，頁面在顯示前調(diào)用querySubject接口，傳遞參數(shù)為試卷名稱，分別將試卷題目關(guān)聯(lián)表（papersubject）與選擇題表（choice）、試卷題目關(guān)聯(lián)表（papersubject）與填空表（fillintheblank）、試卷題目關(guān)聯(lián)表（papersubject）與判斷表（judge）連接查詢題目所有信息并返回給前端界面并顯示。

當學生答完題點擊提交時，調(diào)用后臺上傳答案接口（answer），傳遞參數(shù)為答案、試卷名稱和學生id。遍歷answer中的答案并保存在學生答案表（paperanswer）中，在每次遍歷時調(diào)用打分函數(shù)（mark），該函數(shù)將學生的答案與正確答案做對比，無誤則在總分基礎(chǔ)上加該題目的分值。遍歷結(jié)束后得到學生成績最后存入學生成績表（paperhistory）中。

2.3.4 學生查看錯題

學生選擇要查看的試卷，該頁面在顯示前調(diào)用queryHistory接口，傳遞參數(shù)為學生id，查詢學生成績表（paperhistory）表，將試卷名稱返回前臺并顯示。

學生選擇試卷后，頁面跳轉(zhuǎn)并將試卷名稱發(fā)送到顯示錯題界面，該頁面在顯示前調(diào)用queryHistoryData接口，傳遞參數(shù)為學生id和試卷名稱，先在學生成績表（paperhistory）中獲取該試卷的分數(shù)，再將選擇題表（choice）、學生答案表（paperanswer）、試卷題目關(guān)聯(lián)表（papersubject）連接，查詢學生錯題信息，包括題干、答案、學生答案，填空和判斷與該方法相同。最后將查詢到的結(jié)果返回并顯示在界面上。

3 結(jié)束語

在線測試系統(tǒng)基于微信小程序平臺開發(fā)，使用MVC開發(fā)模式，各模塊之間松耦合，方便運行和維護。微信小程序是最近新興的開發(fā)和使用方式，也是以后程序推廣和開發(fā)的潮流，微信小程序的使用很方便，無需下載，搜索小程序名稱或掃一掃即可。

目前本應(yīng)用滿足了學生和教師的基本使用需求，不僅有助于教師及時掌握學生學習情況，而且有助于學生及時自測學習的效果，但還可以增加一些功能，將程序更加完善。如可以將成績導(dǎo)出成excel表格，教師可以選擇、篩選、排序，更加方便教師了解學生的成績的分布。學生答完題目之后，只能看到自己的錯題，并且不能重新做一遍卷子進行自我測驗。若要完善學生功能部分，可以添加學生自測的功能，將學生的錯題重新組合，學生可以選擇自己測驗，或者選擇以前做過的試卷，重新做一遍，加深印象。

參考文獻：

[1] 易偉.微信小程序快速開發(fā)：視頻指導(dǎo)版[M].北京：人民郵電出版社，2017：2-3.

[2] 劉剛.微信小程序開發(fā)圖解案例教程[M].北京：人民郵電出版社，2017：2-3.

[3] 張帆.微信小程序開發(fā)零基礎(chǔ)入門[M].北京：電子工業(yè)出版社，2017：18-20.

[4] 張雪云，牟艷，申紅偉.基于微信小程序的電源監(jiān)測管理系統(tǒng)設(shè)計[J].計算機與現(xiàn)代化，2017（12）：98-102.

[5] 微動天下.微信小程序和微信公眾號有什么區(qū)別[N/OL].知乎，2017.

[6] 微信官方.微信小程序開發(fā)簡易教程之WXSS教程[EB/OL].https：//mp.weixin.qq.com/debug/wxadoc/dev/quickstart/basic/file.html#wxss-樣式.

[7] 于亮.Mybatis簡介與原理[EB /OL]. （2015-04-28）.http：//jiuqiyuliang.iteye.com/blog/2216123.

[8] 賴均.軟件工程[M].北京：清華大學出版社，2016：85-87.

【通聯(lián)編輯：王力】