虛擬仿真實驗課堂教學管理系統(tǒng)的設計與實現(xiàn)

郝明陽，高尚兵，于 坤，潘志庚

(1. 淮陰工學院 計算機與軟件工程學院，江蘇 淮安 223001；2. 杭州師范大學 虛擬現(xiàn)實與智能系統(tǒng)研究院，杭州 311121)

信息技術的不斷發(fā)展推動了教育領域的深刻變革[1]。隨著虛擬仿真技術和教育科學的發(fā)展，實驗室教育信息化水平不斷提高，虛擬仿真實驗教學逐漸開展。虛擬仿真實驗教學具有實驗內(nèi)容多源化、實驗過程自動化、能力評價科學化、教學輔助智能化的特征[2]。對于需要高成本、高消耗，以及存在高風險或極端環(huán)境、不可及或不可逆操作的大型實驗項目，虛擬仿真實驗教學優(yōu)勢明顯[3]。近年來，各學科虛擬仿真實驗教學平臺建設已經(jīng)取得了一定成果，張飛燕等[4]研究了巷道掘進爆破安全虛擬仿真實驗教學平臺建設；楊國鑫等[5]構(gòu)建了基于Unity3D的化學虛擬仿真實驗教學平臺；朱勝雪等[6]對交通運輸虛擬仿真實驗教學平臺的相關建設經(jīng)驗進行了探討。

課堂教學是虛擬仿真實驗教學的重要方式，虛擬仿真實驗教學平臺相關研究主要集中在虛擬仿真實驗教學資源建設和線上虛擬仿真實驗教學平臺搭建等方面，對于虛擬仿真實驗教學管理，尤其是虛擬仿真實驗課堂教學管理并未涉及。現(xiàn)有的課堂管理系統(tǒng)多為傳統(tǒng)機房管理軟件，如聯(lián)想傳奇電子教室、極域電子教室等軟件。這些軟件針對信息技術課堂教學開發(fā)，可以輔助教師輕松地管理學生，但是虛擬仿真實驗技術的發(fā)展，對課堂教學管理軟件提出了更多的功能需求，在虛擬仿真實驗課堂教學過程中，現(xiàn)有的課堂管理軟件與虛擬仿真實驗教學資源之間信息孤島和信息共享問題嚴重，導致軟件不能接收實驗數(shù)據(jù)及管理實驗參數(shù)與仿真結(jié)果，無法與實驗資源實現(xiàn)交互，對學生實驗過程進行教學指導和干預。為此，通過對虛擬仿真實驗課堂教學流程分析，提出采用前后端分離架構(gòu)模式實現(xiàn)新型虛擬仿真實驗課堂教學管理系統(tǒng)，以解決現(xiàn)有課堂教學管理系統(tǒng)功能單一，擴展性弱的問題。同時，采用WebSocket技術建立實驗資源模塊和系統(tǒng)之間的通訊，為實驗課堂教學管理人員實時提供課堂實驗數(shù)據(jù)，同時也支持教學人員控制學生實驗步驟；采用JSON輕量級數(shù)據(jù)交互模塊實現(xiàn)實驗資源模塊與系統(tǒng)間的數(shù)據(jù)流高效交互[7]；同時利用數(shù)據(jù)庫技術對課堂文件和仿真實驗結(jié)果進行管理，支持課堂仿真實驗數(shù)據(jù)以班級或?qū)嶒灋閱挝坏膶雽С觥?/p>

1 系統(tǒng)需求分析

隨著虛擬仿真實驗課程的增加，實驗課堂教學過程中產(chǎn)生大量的實驗參數(shù)和仿真結(jié)果，為了更好地支持課堂教學管理，提高虛擬仿真實驗課堂教學信息化程度，系統(tǒng)不僅需要具有傳統(tǒng)課堂管理功能，還應滿足虛擬仿真實驗課堂教學特殊需求：實驗教師通過實驗進度監(jiān)控功能輔助進行課堂實驗進度管理，利用在線實驗指導功能提示學生相關實驗操作，也可通過實驗步驟調(diào)控功能控制學生實驗進度，調(diào)整學生實驗步驟。現(xiàn)階段課堂教學過程中學生實驗成績管理信息化程度較低，需要手動統(tǒng)計，實驗結(jié)果統(tǒng)計功能能夠?qū)嶒瀰?shù)和仿真實驗結(jié)果自動統(tǒng)計和分析，為學生實驗學習效果評價提供依據(jù)。因此，基于前后端分離的虛擬仿真實驗課堂教學管理系統(tǒng)不僅需要具有傳統(tǒng)課堂管理軟件的課堂管理功能，還應借助虛擬仿真、數(shù)據(jù)庫和網(wǎng)絡通信等技術，實現(xiàn)實驗課堂教學有序管理和實驗操作教學短時高效的有機結(jié)合。即虛擬仿真實驗課堂教學管理模塊需要具備以下基本功能：課堂人員管理、遠程屏幕查看、課堂信息交流、課堂通知發(fā)布等；以及針對虛擬仿真實驗課堂應用場景還需具備以下輔助功能：實驗進度監(jiān)控、在線實驗指導、實驗步驟調(diào)控、實驗結(jié)果統(tǒng)計等。

2 系統(tǒng)設計

2.1 系統(tǒng)功能設計

虛擬仿真實驗課堂教學管理系統(tǒng)的開發(fā)目的，主要是為課堂實驗教學和課堂實驗管理提供功能支持。根據(jù)虛擬仿真實驗課堂教學流程，對系統(tǒng)功能進行模塊化設計，如圖1所示。依據(jù)不同的用戶角色，將系統(tǒng)分為三個模塊：系統(tǒng)管理模塊、課堂管理模塊和學生模塊。

圖1 軟件功能結(jié)構(gòu)圖

2.1.1系統(tǒng)管理模塊

系統(tǒng)管理模塊在整個系統(tǒng)中起著十分重要的作用，負責教學管理系統(tǒng)數(shù)據(jù)的保存與備份，是整個系統(tǒng)正常運行的基礎。虛擬仿真實驗課堂教學多以班級為單位，學生用戶憑學號和密碼登陸，進入自己所在的實驗課堂學習。系統(tǒng)管理模塊僅對特定人員開放，管理員和賦予相應權限的用戶才能訪問系統(tǒng)管理模塊。

2.1.2課堂管理模塊

系統(tǒng)中的課堂管理模塊主要面向?qū)嶒灲處煛＝處煹顷懴到y(tǒng)后通過課堂人員管理功能獲取加入課堂的用戶信息，實現(xiàn)課堂考勤統(tǒng)計。實驗投屏演示功能輔助教師進行實驗內(nèi)容講解，教師可以將實驗資源和實驗報告等實驗相關文件通過課堂文件管理功能分發(fā)至學生。實驗進度監(jiān)控功能對整個教學班級的實驗進度實時匯總，并通過圖表直觀展現(xiàn)。實驗導調(diào)模塊包括遠程屏幕查看、在線實驗指導和實驗步驟調(diào)控等功能，支持教師查看學生實驗圖像信息并進行在線實驗指導和調(diào)控學生實驗步驟。實驗成績管理模塊負責統(tǒng)計課堂學生實驗成績并進行分析，并將統(tǒng)計和分析結(jié)果展示并保存。

2.1.3學生模塊

學生是虛擬仿真實驗課堂教學管理的主要對象，學生模塊為學生接收課堂教學信息提供功能支持。學生模塊的主要功能包括：遠程屏幕查看、課堂信息交流、課堂信息查看、遠程屏幕共享、指導信息接收、實驗成績管理、個人信息管理等，學生可以通過該模塊收發(fā)課堂相關信息，完成課堂學習和其他信息交流。

2.2 系統(tǒng)架構(gòu)設計

虛擬仿真實驗課堂教學管理系統(tǒng)包括客戶端、服務器集群和虛擬仿真實驗設備三類重要設備節(jié)點，系統(tǒng)架構(gòu)如圖2所示。客戶端包括管理端、教師端和學生端，系統(tǒng)客戶端選擇Web瀏覽器作為主要目標開發(fā)平臺，可以充分發(fā)揮瀏覽器的便捷性，用戶無需安裝本地程序即可登錄使用系統(tǒng)。虛擬仿真實驗設備是整個系統(tǒng)中重要的網(wǎng)絡節(jié)點控制器，實驗設備一方面接收客戶端的命令，調(diào)用相應的控制程序指令，完成虛擬仿真實驗控制過程，另一方面向應用服務器發(fā)送實驗進度數(shù)據(jù)和實驗狀態(tài)等信息。應用服務器上安裝應用服務端軟件，接收并處理實驗資源下載、實驗數(shù)據(jù)更新、實驗步驟跳轉(zhuǎn)等實驗課堂操作請求。應用服務器與數(shù)據(jù)庫服務器直接相連，對數(shù)據(jù)庫中的課堂實驗數(shù)據(jù)進行操作，同時，應用服務器通過WebSocket協(xié)議與虛擬仿真實驗設備相連，實現(xiàn)對實驗進程的監(jiān)控和直接控制[8]。整個前端項目部署在文件服務器上，文件服務器主要提供前端靜態(tài)資源，包括用戶界面中的HTML頁、JavaScript腳本、CSS樣式文件等[9]；數(shù)據(jù)庫服務器用于實驗課堂教學管理相關數(shù)據(jù)存儲，為應用服務器提供數(shù)據(jù)支持，保證系統(tǒng)數(shù)據(jù)請求的實時響應。

圖2 系統(tǒng)整體架構(gòu)圖

Web應用信息的交互通常是通過客戶端發(fā)送請求，服務器接收請求并進行處理，然后將結(jié)果返回給客戶端完成信息呈現(xiàn)。虛擬仿真實驗設備在運行過程中，實驗步驟和實驗狀態(tài)等各種課堂實驗數(shù)據(jù)在不斷變化，傳統(tǒng)的Web應用信息交互方式無法實現(xiàn)課堂信息在客戶端的實時展示。因此，各系統(tǒng)設備節(jié)點間的數(shù)據(jù)通信是整個系統(tǒng)設計的關鍵。在對HTML5標準中WebSocket協(xié)議進行探究的基礎上，提出一種基于WebSocket的實時通信解決方案。在WebSocket提出之前，開發(fā)人員使用輪詢、長輪詢等解決方案實現(xiàn)實時交互，這種傳統(tǒng)模式存在明顯缺陷：客戶端需要不斷向服務器發(fā)送HTTP請求，在得到服務器響應之后兩者建立連接，數(shù)據(jù)交互結(jié)束以后連接斷開，再次通信需要建立新的連接，每次通信都需要重新連接，嚴重影響系統(tǒng)實時性[10]。WebSocket可以在客戶端和服務器之間建立全雙工通信通道，實現(xiàn)真正意義上的長連接，不需要來自客戶端的輪詢請求，服務器也可以將信息推動到客戶端，用于構(gòu)建實時Web應用非常方便。WebSocket的出現(xiàn)使得客戶端瀏覽器也能使用Socket進行實時通信，并且在數(shù)據(jù)傳輸?shù)姆€(wěn)定性和數(shù)據(jù)傳輸規(guī)模方面與傳統(tǒng)模式相比具有顯著優(yōu)勢，客戶端也能像C/S架構(gòu)下的桌面應用一樣與服務器進行實時通信。虛擬仿真實驗課堂教學系統(tǒng)通過ws協(xié)議建立客戶端、虛擬仿真實驗設備與服務器的連接，使用WebSocket API提供的onopen、onmessage、onerror和onclose事件完成連接狀態(tài)監(jiān)控、課堂信息發(fā)送、連接錯誤診斷、斷開連接等功能[11]。

2.3 系統(tǒng)前后端分離設計

傳統(tǒng)的Web開發(fā)基于MVC開發(fā)模式，需要在頁面上修改大部分的業(yè)務邏輯，前端開發(fā)依賴后端，導致前端改動成本較大，在代碼調(diào)試、維護、代碼重用方面存在不少的問題。前后端分離架構(gòu)是一種Web應用開發(fā)的新型架構(gòu)模式，如圖3所示，與傳統(tǒng)的MVC架構(gòu)模式不同，客戶端不是向服務器請求完整的HTML頁面，而是通過前端控制路由調(diào)用AJAX向后臺發(fā)送請求，后端提供API接口支撐前端業(yè)務數(shù)據(jù)和服務，服務器讀寫數(shù)據(jù)庫并響應前端數(shù)據(jù)請求[9]，客戶端異步獲取數(shù)據(jù)后局部操作DOM進行展示。相比于傳統(tǒng)的MVC模式，前后端分離架構(gòu)模式解決了傳統(tǒng)MVC架構(gòu)模式存在的種種問題，它的優(yōu)點包括：(1)前端項目中無需嵌入后端代碼，前后端解耦合，二者并行開發(fā)，提高開發(fā)效率[12]；(2)通過配置前端路由，可以實現(xiàn)按需加載頁面，無需加載網(wǎng)站所有資源，服務器不再需要解析前端頁面，提升頁面響應速度[13]；(3)更快速地定位開發(fā)過程中出現(xiàn)的問題，客戶端的問題可由前端開發(fā)人員獨立解決，代碼重構(gòu)及可維護性增強。

圖3 前后端分離開發(fā)架構(gòu)圖

考慮到系統(tǒng)的開發(fā)效率、可維護性及功能擴展性，虛擬仿真實驗課堂教學管理系統(tǒng)采用前后端分離架構(gòu)模式開發(fā)。系統(tǒng)前端負責數(shù)據(jù)顯示和請求響應，為用戶提供系統(tǒng)登錄、課堂教學管理信息、課堂實驗進度、在線實驗指導等應用組件。用戶能夠通過前端界面提交各種請求，前端調(diào)用后端服務接口，在后端執(zhí)行業(yè)務邏輯和數(shù)據(jù)處理后，將后端返回的數(shù)據(jù)接收并在頁面上向用戶展示。后端主要包括請求響應模塊和數(shù)據(jù)庫操作模塊，后端向前端提供系統(tǒng)控制接口，并在控制器的約束和控制下執(zhí)行業(yè)務邏輯和數(shù)據(jù)處理。系統(tǒng)采用AJAX技術來實現(xiàn)前端請求響應和數(shù)據(jù)交互，AJAX通過JavaScript向后端發(fā)送請求并處理響應。前端發(fā)起AJAX請求從后端控制層獲取數(shù)據(jù)后，只需修改網(wǎng)頁的某一部分即可直接呈現(xiàn)頁面，有利于頁面數(shù)據(jù)的實時動態(tài)更新。在完成前后端分離后，前后端均成為單獨的項目，每個項目都部署在單獨的服務器上，提高了頁面響應速度，并且在用戶交互和用戶體驗上也有較大提升。

2.4 數(shù)據(jù)庫設計

數(shù)據(jù)庫服務器選擇MySQL，數(shù)據(jù)庫設計就是為了將信息化的數(shù)據(jù)統(tǒng)一、高效地組織起來。數(shù)據(jù)庫設計的好壞不僅影響系統(tǒng)性能，還會對系統(tǒng)開發(fā)、維護和功能拓展產(chǎn)生影響[14]。在對各模塊需求分析的基礎上，對系統(tǒng)平臺數(shù)據(jù)庫和字段進行了設計。系統(tǒng)中主要的表有課堂人員簽到表(tb_Class_info)、課堂通知表(tb_Exp_notice)、課堂進度表(tb_Exp_Progress)、實驗室表(tb_Exp_Room)、實驗名稱表(tb_Exp_Name)、課堂實驗成績表(tb_Exp_score)實驗明細表(tb_Exp_info)、實驗設備表(tb_Exp_equip)、管理員信息表(tb_Admin_info)、教師信息管理表(tb_Teacher_info)、學生信息管理表(tb_Student_info)等多張數(shù)據(jù)庫表單。

3 系統(tǒng)實現(xiàn)

3.1 前端開發(fā)

系統(tǒng)用戶頁面應側(cè)重于虛擬仿真實驗課堂教學信息的分類展示，使系統(tǒng)界面分類合理、層次分明、結(jié)構(gòu)緊湊[15]。系統(tǒng)前端項目開發(fā)采用Vue.js框架，開發(fā)工具為Visual Studio Code。Vue.js是一套數(shù)據(jù)驅(qū)動的、可以自底向上逐層應用的前端框架，與其他主流JavaScript框架例如AngularJS或React等相比，Vue.js具有語法簡潔、上手容易、自身占用空間小、運行效率高等特點[16]。Vue.js框架將頁面視為一個大的組件，又將頁面繼續(xù)拆分成多個組件，前端部分頁面組件代碼相同，通過封裝部分通用組件代碼，多個頁面可以使用同一組件，實現(xiàn)了組件復用，提高開發(fā)效率。前端項目應用Element UI組件進行用戶登錄、實驗課堂通知和實驗課堂導調(diào)等系統(tǒng)界面的快速開發(fā)。前端用戶請求和頁面跳轉(zhuǎn)通過路由(Vue-router)管理，對于需要通信的組件，先注冊路由并掛載在頁面，路由中頁面組件和URL之間是映射關系，當路徑發(fā)生改變時，組件也會相應進行切換。本系統(tǒng)采用按需加載的方式加載組件，優(yōu)化了組件加載，提升了頁面響應速度。

3.2 后端開發(fā)

后端項目開發(fā)使用語言為Java，開發(fā)工具為IntelliJ IDEA 2019，采用SpringBoot框架進行項目搭建，SpringBoot相關的庫依賴使用Maven項目管理工具進行管理，開發(fā)完成后打包成可執(zhí)行Jar包部署在服務器上。SprintBoot是由Pivotal團隊提供的全新框架，解決了很多繁瑣的配置工作問題，從而使開發(fā)人員專注于Spring應用開發(fā)而無需過多關注樣板化的配置，基于SpringBoot快速高效地搭建完整的Web應用后臺。系統(tǒng)后端的核心功能為WebSocket的連接、管理和數(shù)據(jù)收發(fā)。SpringBoot對WebSocket服務端提供了良好的支持，在Maven文件中加入WebSocket依賴即可，開發(fā)過程中只需關注業(yè)務需求的實現(xiàn)，有效降低了系統(tǒng)實現(xiàn)難度，提升了開發(fā)效率。導入依賴后，后端項目添加spring-boot-starter-websocket依賴來獲得WebSocket服務端的支持，通過Configuration注解實現(xiàn)配置，路徑參數(shù)中攜帶用戶名和用戶身份信息，客戶端可通過WebSocketServer與服務器端進行通信。

3.3 系統(tǒng)重要功能實現(xiàn)

系統(tǒng)將學生課堂實驗數(shù)據(jù)變化信息通過WebSocket實時推送至實驗進度監(jiān)控界面，界面利用數(shù)字，顏色等顯示特性來表現(xiàn)學生實驗狀態(tài)，直觀展示課堂學生實驗實時數(shù)據(jù)的變化。課堂教學人員可以點擊任意學生圖標，進入在線實驗指導界面，觀察學生實驗畫面，通過學生實驗操作情況，選擇向?qū)W生發(fā)送實驗指導信息或是對學生實驗步驟做出調(diào)控。

實驗進度監(jiān)控、在線實驗指導和實驗步驟調(diào)控等重要功能的實現(xiàn)過程主要分為以下步驟：

(1)自定義WebSocket中的onopen、onmessage、onerror和onclose事件內(nèi)容。重寫事件內(nèi)容，對WebSocket信息發(fā)送狀態(tài)進行監(jiān)控。重寫onmessage的目的主要是判斷信息來源與信息類型，將來自虛擬仿真實驗設備的實驗參數(shù)和仿真結(jié)果信息儲存并展示。

(2)自定義SendMessageByIP、SendMessageByIdentity類，該實現(xiàn)類的目的是根據(jù)前端請求的路徑，分析路徑中包含的IP和角色信息，判斷需要傳輸?shù)男畔⒎N類并使用不同方法完成信息發(fā)送。

(3)實現(xiàn)WebRTC中的getUserMedia和RTCPeerVConnection接口，接口方法的主要功能是在建立客戶端之間的連接和視頻通訊，主要目的是根據(jù)前端請求信息，建立與特定客戶端之間的實時視頻通訊，查看學生實驗圖像。

在完成上面的工作之后，還要與虛擬仿真實驗運行設備聯(lián)合測試，確保系統(tǒng)能正確對應實驗步驟和仿真結(jié)果。

4 結(jié)論

本文采用前后端分離架構(gòu)模式進行虛擬仿真實驗課堂教學管理系統(tǒng)設計和實現(xiàn)，通過WebSocket協(xié)議實現(xiàn)了虛擬仿真實驗模塊實時通信，有效解決了傳統(tǒng)課堂管理軟件功能不完善，缺少虛擬仿真實驗模塊數(shù)據(jù)流交互的問題。相對傳統(tǒng)課堂教學管理軟件，本系統(tǒng)還具有實驗進度監(jiān)控、在線實驗指導、實驗步驟調(diào)控等多種實驗課堂教學管理需求功能，代碼復用性和功能可擴展性更強。