徐愛春

摘 要： 虛擬教室在遠(yuǎn)程開放式教學(xué)中已成為有效的教學(xué)媒體和日常教育管理的有力工具。然而，目前虛擬教室存在著交互差、實(shí)時(shí)性不強(qiáng)、點(diǎn)對(duì)點(diǎn)溝通困難、功能單一等缺點(diǎn)。為滿足當(dāng)前虛擬教室需要實(shí)時(shí)協(xié)同交互式等新需求，在研究原有虛擬教室功能和最新計(jì)算機(jī)技術(shù)基礎(chǔ)上，提出采用HTML5、Node.js、WebRTC等技術(shù)，實(shí)現(xiàn)了一個(gè)集視頻對(duì)話、即時(shí)通訊、白板演示等功能的虛擬教室應(yīng)用平臺(tái)。使用結(jié)果表明，該平臺(tái)功能完整，使用方便，可以滿足當(dāng)前虛擬教室實(shí)際需要。

關(guān)鍵詞： 開放式教學(xué)； 虛擬教室； 實(shí)時(shí)交互； 應(yīng)用平臺(tái)

中圖分類號(hào)：TP399 文獻(xiàn)標(biāo)志碼：A 文章編號(hào)：1006-8228（2017）09-16-03

Abstract： Virtual classroom has become an effective teaching media and a powerful tool for daily education management in the open e-learning education. However， there are some shortcomings in the virtual classroom， such as poor interaction， low real-time performance， difficulty in point to point communication and less function. In order to meet the needs of the virtual classroom for real-time collaboration and interaction etc.， on the basis of the research of the existing virtual classroom functions and the latest computer technologies， this paper proposes to realize a virtual classroom application platform with functions of real-time video interaction， IM， white-board and so on， by using the technologies of HTML5， Node.js and WebRTC etc. The application result shows that the platform is fully functional and easy to use， and can meet the actual needs of the current virtual classroom.

Key words： open e-learning； virtual classroom； real-time collaboration； application system

0 引言

遠(yuǎn)程開放教育課堂，教學(xué)方法主要是通過教師遠(yuǎn)程講解，與學(xué)生實(shí)時(shí)互動(dòng)交流[1]，以及解答學(xué)生在學(xué)習(xí)和聽課過程中遇到各類問題，以幫助學(xué)生及時(shí)掌握和鞏固所學(xué)知識(shí)，從而提高學(xué)生學(xué)習(xí)的積極性和獲得良好的教學(xué)效果。日常使用中發(fā)現(xiàn)，目前大多數(shù)的虛擬教室軟件系統(tǒng)只包含課程文本資料、教學(xué)視頻、教師解答等基本功能，功能單一，無法實(shí)現(xiàn)教師遠(yuǎn)程教學(xué)過程師生之間實(shí)時(shí)互動(dòng)，達(dá)不到預(yù)期教學(xué)效果。

本文在研究現(xiàn)有虛擬教室技術(shù)的基礎(chǔ)上[2]，采用HTML5、Node.js、WebRTC等技術(shù)[3]，設(shè)計(jì)并實(shí)現(xiàn)了一套集實(shí)時(shí)視頻通訊、在線答疑系統(tǒng)、白板系統(tǒng)，屏幕共享系統(tǒng)[4]等功能的實(shí)時(shí)交互式虛擬教室平臺(tái)，有效地解決了目前虛擬教室相關(guān)；該平臺(tái)已經(jīng)在我校遠(yuǎn)程教學(xué)中得到使用，教學(xué)效果良好，具有一定的推廣和使用價(jià)值。

1 系統(tǒng)總體結(jié)構(gòu)

本系統(tǒng)基于HTML5技術(shù)的實(shí)時(shí)交互虛擬教室（WebIVC），系統(tǒng)總體結(jié)構(gòu)如圖1所示。圖1中，教師和學(xué)生可以通過筆記本、臺(tái)式機(jī)、手機(jī)、平板登陸，進(jìn)行實(shí)時(shí)交互。

本系統(tǒng)主要包括如下幾個(gè)核心模塊。

安全認(rèn)證模塊 用戶通過系統(tǒng)設(shè)置的賬號(hào)和密碼登陸，通過系統(tǒng)驗(yàn)證后，根據(jù)用戶分配的系統(tǒng)權(quán)限，為用戶提供與其權(quán)限相適應(yīng)的功能，如實(shí)時(shí)交互課堂、通知通告、視頻培訓(xùn)等。

教室管理模塊 教室管理是本平臺(tái)的一個(gè)核心組件，包括教室創(chuàng)建、學(xué)生管理、消息管理、白板、音視頻交互、視頻資料管理等[5]。通過本模塊為學(xué)生分配相關(guān)權(quán)限，比如哪些學(xué)生可以發(fā)消息，哪些學(xué)生可以使用白板。同時(shí)，通過SOA技術(shù)，將視頻培訓(xùn)資料共享到教室中，供學(xué)生參考學(xué)習(xí)。

網(wǎng)絡(luò)視頻會(huì)議模塊 網(wǎng)絡(luò)視頻會(huì)議模塊實(shí)現(xiàn)“面對(duì)面”實(shí)時(shí)交互、在線PPT展示、屏幕共享等功能，采用的通訊協(xié)議包括JSEP（JavaScript Session Establishment Protocol）、SDP（Session Description Protocol）、network address translation （NAT）、STUN/TURN Server等。

展示工具模塊 展示工具組件為學(xué)生及教師提供實(shí)時(shí)通信、白板、表情、在線答疑等功能。

2 系統(tǒng)技術(shù)架構(gòu)

系統(tǒng)總體技術(shù)體架構(gòu)如圖2所示，在圖2中，整個(gè)系統(tǒng)分為三層，持久層主要用于保存用戶信息以及相關(guān)接口數(shù)據(jù)，業(yè)務(wù)邏輯層使用WebSocket和Ajax技術(shù)響應(yīng)前端通訊請(qǐng)求和獲取后端數(shù)據(jù)，前端展示層主要系統(tǒng)功能實(shí)現(xiàn)，包括白板、實(shí)時(shí)音視頻交流、視頻接口等。

3 關(guān)鍵功能實(shí)現(xiàn)

3.1 學(xué)生登錄監(jiān)聽

當(dāng)后端監(jiān)聽器監(jiān)聽到有學(xué)生登錄系統(tǒng)，立即調(diào)用呼叫系統(tǒng)邀請(qǐng)學(xué)生加入所指定的虛擬教室。

3.2 本地資源獲取

通過NodeJS，初始化本地多媒體資源，包括攝像頭、音頻設(shè)備等。

3.3 遠(yuǎn)程屏幕共享實(shí)現(xiàn)

虛擬教室的師生可以將各自的屏幕分享給其他人，主要代碼如下。

4 結(jié)束語

本文分析了當(dāng)前開放教育課堂教學(xué)中所使用的虛擬教室系統(tǒng)相關(guān)需求，在研究現(xiàn)有虛擬教室技術(shù)的基礎(chǔ)上，設(shè)計(jì)并實(shí)現(xiàn)了基于HTML5等技術(shù)的實(shí)時(shí)交互式虛擬教室系統(tǒng)。本系統(tǒng)主要包括實(shí)時(shí)視頻對(duì)話、屏幕共享、白板等功能模塊，基本滿足當(dāng)前遠(yuǎn)程開放式課堂教學(xué)所需。系統(tǒng)采用B/S模式，所有功能均可在移動(dòng)設(shè)備和PC端使用，并且屏蔽了各類操作系統(tǒng)之間的差異，實(shí)現(xiàn)了跨平臺(tái)教學(xué)，在實(shí)際課堂教學(xué)中取得了良好的效果。

本系統(tǒng)還存在諸多不足，如超過10人在線教學(xué)，會(huì)發(fā)生服務(wù)器響應(yīng)慢的情況，有時(shí)卡頓現(xiàn)象嚴(yán)重，所需網(wǎng)絡(luò)帶寬高；文字通訊頁面功能簡單，頁面不夠美觀；權(quán)限管理設(shè)置單一，無法實(shí)現(xiàn)細(xì)粒度權(quán)限設(shè)置。

下一步，筆者將優(yōu)化視頻通訊響應(yīng)速度，自適應(yīng)網(wǎng)絡(luò)帶寬，并且將用戶界面設(shè)計(jì)的更加簡潔美觀，在系統(tǒng)操作方面做到更加簡單明了。

參考文獻(xiàn)（References）：

[1] 林鴻，王松，楊鑫，等.基于WebRTC技術(shù)的應(yīng)用及平臺(tái)技術(shù)開

發(fā)與設(shè)計(jì)[J].電信科學(xué)，2013.29（9）：20-25

[2] 屈振華，李慧云，張海濤等.WebRTC 技術(shù)初探[J].電信科學(xué)，

2012.28（10）：106-110

[3] 李冬.一種基于WebRTC的視頻會(huì)議系統(tǒng)的架構(gòu)[J].智能計(jì)

算機(jī)與應(yīng)用，2015.4：39-41

[4] 黃瑞，周曉寧，鄒霞.基于虛擬教室的協(xié)作學(xué)習(xí)設(shè)計(jì)研究[J].中

國教育信息化，2014.4：68-71

[5] 李亮.基于Web實(shí)時(shí)交互的虛擬教室的設(shè)計(jì)與實(shí)現(xiàn)[J].中國

教育信息化，2012.7：42-44endprint