應(yīng)悅 簡(jiǎn)琤峰

摘要：本文針對(duì)基于云計(jì)算的遠(yuǎn)程教育對(duì)實(shí)時(shí)性、多樣化、個(gè)性化交流的需求，提出了支持移動(dòng)自主學(xué)習(xí)的云黑板教學(xué)模式，并設(shè)計(jì)開(kāi)發(fā)了基于移動(dòng)WEB的多用戶(hù)協(xié)同交流云黑板系統(tǒng)。

關(guān)鍵詞：遠(yuǎn)程教育；協(xié)同技術(shù)；云黑板

中圖分類(lèi)號(hào)：G40-057 文獻(xiàn)標(biāo)識(shí)碼：A 論文編號(hào)：1674-2117（2016）19-0069-04

● 引言

當(dāng)前的遠(yuǎn)程教育系統(tǒng)，無(wú)法充分發(fā)揮教室內(nèi)傳統(tǒng)教學(xué)實(shí)時(shí)交互交流的優(yōu)勢(shì)。雖然能為用戶(hù)提供一定的協(xié)作交互環(huán)境，但都是按照系統(tǒng)預(yù)先設(shè)置好的步驟進(jìn)行，缺少靈活性。當(dāng)需要實(shí)時(shí)溝通時(shí)，基本上是通過(guò)視頻、語(yǔ)音和文字的方式進(jìn)行交流，可許多溝通是需要通過(guò)一種類(lèi)似傳統(tǒng)課堂的黑板媒介來(lái)實(shí)時(shí)交互進(jìn)行的，這一點(diǎn)在現(xiàn)有的遠(yuǎn)程教學(xué)系統(tǒng)中卻很難實(shí)現(xiàn)。

因此，筆者結(jié)合當(dāng)前的云教育平臺(tái)，研究了一種基于移動(dòng)終端的支持自主移動(dòng)學(xué)習(xí)的“云黑板”教學(xué)平臺(tái)，它具有支持模擬黑板協(xié)同交流、支持移動(dòng)WEB跨平臺(tái)和支持多用戶(hù)在線實(shí)時(shí)參與的特點(diǎn)，能為遠(yuǎn)程用戶(hù)提供實(shí)時(shí)交流，更能激發(fā)學(xué)生的學(xué)習(xí)興趣和學(xué)習(xí)動(dòng)力，體現(xiàn)學(xué)生學(xué)習(xí)的能動(dòng)性和自主性。

● 支持移動(dòng)自主學(xué)習(xí)的云黑板模式

現(xiàn)代遠(yuǎn)程教育由教師、網(wǎng)絡(luò)和學(xué)生三個(gè)關(guān)鍵要素組成。傳統(tǒng)的網(wǎng)絡(luò)教育是教師在線直播，學(xué)生連接網(wǎng)絡(luò)接受授課的在線教育模式。然而直播并不能真正體現(xiàn)遠(yuǎn)程教育對(duì)實(shí)時(shí)性的需求，即使學(xué)生能夠在線提問(wèn)、在線留言。筆者提出的云黑板教學(xué)模式，不僅會(huì)有基本的多用戶(hù)語(yǔ)言交流，更能支持師生在云黑板平臺(tái)實(shí)現(xiàn)模擬黑板的操作，即教師在授課的同時(shí)，可以在云黑板上作圖，學(xué)生可以實(shí)時(shí)參與從而協(xié)同繪制，最終實(shí)現(xiàn)實(shí)時(shí)“你見(jiàn)即我見(jiàn)”的效果。云服務(wù)資源服務(wù)器的支持，以及云黑板移動(dòng)終端客戶(hù)端的適配讓遠(yuǎn)程教育用戶(hù)有了多樣化、個(gè)性化的選擇。對(duì)移動(dòng)設(shè)備的支持，可以最大程度地減少教師開(kāi)課以及學(xué)生上課時(shí)受到的時(shí)空限制；學(xué)生可以實(shí)時(shí)參與多種課程的學(xué)習(xí)，為自己制訂學(xué)習(xí)計(jì)劃，充分體現(xiàn)云黑板系統(tǒng)對(duì)多樣化、個(gè)性化需求的滿(mǎn)足。這樣，移動(dòng)終端多用戶(hù)協(xié)同交流云黑板，真正做到了適應(yīng)任何人在任何時(shí)間、任何地點(diǎn)，選擇任何內(nèi)容進(jìn)行學(xué)習(xí)，真正讓使用對(duì)象脫離計(jì)算機(jī)屏幕的約束，給參與者提供了一種舒適休閑狀態(tài)的學(xué)習(xí)啟發(fā)空間，提供了便利的隨時(shí)隨地參與學(xué)習(xí)的自主移動(dòng)學(xué)習(xí)途徑。

作為為移動(dòng)終端客戶(hù)端提供云黑板的后臺(tái)支持，服務(wù)器端運(yùn)行云黑板支持系統(tǒng)還需要建立相應(yīng)的遠(yuǎn)程教學(xué)資源庫(kù)。移動(dòng)終端主要提供云黑板客戶(hù)端模塊，如下頁(yè)圖1所示，需要解決的關(guān)鍵技術(shù)有瀏覽器矢量圖形繪制與編輯、矢量圖形對(duì)象并發(fā)控制，同時(shí)需要解決基于服務(wù)器推送的協(xié)同設(shè)計(jì)功能。

● 關(guān)鍵技術(shù)

1.系統(tǒng)架構(gòu)

移動(dòng)終端以安卓為例。圖2是云黑板系統(tǒng)的技術(shù)架構(gòu)，從圖中可以看出這是一個(gè)混合應(yīng)用的設(shè)計(jì)方式，移動(dòng)WEB客戶(hù)端被一個(gè)原生應(yīng)用承載?；旌闲偷脑坪诎逑到y(tǒng)移動(dòng)客戶(hù)端不僅保留了一定的可移植性，還保證了類(lèi)似原生應(yīng)用的體驗(yàn)。移動(dòng)終端客戶(hù)端主要分為基本矢量圖形接口、各功能模塊實(shí)現(xiàn)層、用戶(hù)接口調(diào)用層三層。底層基本矢量圖形的接口函數(shù)，提供繪制矢量圖形的上層調(diào)用，這一層是整個(gè)矢量圖形的核心層。功能模塊實(shí)現(xiàn)層能實(shí)現(xiàn)網(wǎng)頁(yè)矢量繪制平臺(tái)的大部分功能。在該層調(diào)用底層繪圖函數(shù)實(shí)現(xiàn)動(dòng)態(tài)繪制、圖形數(shù)據(jù)的異步保存和協(xié)同繪制。最上層是矢量圖形顯示及用戶(hù)接口層，它為用戶(hù)提供繪制基本矢量圖形、選擇矢量圖形、編輯矢量圖形的工具，以及用戶(hù)當(dāng)前操作的圖形顯示和操作狀態(tài)顯示。

2.關(guān)鍵技術(shù)

（1）移動(dòng)終端的多用戶(hù)協(xié)同技術(shù)

在大多數(shù)情況下，協(xié)同設(shè)計(jì)架構(gòu)主要是C/S（Client/Server）結(jié)構(gòu)，服務(wù)器能夠?qū)崟r(shí)向客戶(hù)端推送更新的消息，而不需要客戶(hù)端向服務(wù)器請(qǐng)求。云黑板客戶(hù)端為了保持自身的優(yōu)點(diǎn)，采用了混合模式APP，其核心是移動(dòng)WEB。且在移動(dòng)WEB的B/S（Browser/Server）結(jié)構(gòu)中，移動(dòng)WEB客戶(hù)端需要獲得服務(wù)器上更新的信息，必須通過(guò)請(qǐng)求響應(yīng)模式，這種模式下用戶(hù)獲得的數(shù)據(jù)沒(méi)有實(shí)時(shí)性，而且有大量不必要的數(shù)據(jù)更新，因此會(huì)產(chǎn)生大量冗余數(shù)據(jù)的傳輸。為了解決這一問(wèn)題，筆者專(zhuān)門(mén)研究了服務(wù)器推送的原理，實(shí)現(xiàn)了通過(guò)長(zhǎng)連接技術(shù)，將服務(wù)器端更新的矢量圖形推送給相應(yīng)的移動(dòng)WEB客戶(hù)端，從而達(dá)到類(lèi)似C/S結(jié)構(gòu)實(shí)時(shí)推送的效果。

為了能在移動(dòng)WEB客戶(hù)端的B/S結(jié)構(gòu)中保證前后端通信的實(shí)時(shí)性，需要建立客戶(hù)端和服務(wù)器端之間的長(zhǎng)連接。這里采用的WebSocket能更好地節(jié)省服務(wù)器資源和帶寬，并達(dá)到實(shí)時(shí)通訊。為了在原生應(yīng)用下實(shí)現(xiàn)用戶(hù)登錄以及聊天功能，客戶(hù)端使用了socket.io，而與服務(wù)器建立了另外一條消息通道。socket.io封裝了WebSocket，同時(shí)包含了其他的連接方式，如Ajax等。

矢量圖形的協(xié)同數(shù)據(jù)交換過(guò)程包括矢量圖形的特征基本屬性信息到矢量圖形協(xié)同特征數(shù)據(jù)模型交換、矢量圖形協(xié)同特征數(shù)據(jù)模型的網(wǎng)絡(luò)傳輸服務(wù)器數(shù)據(jù)推送、矢量圖形協(xié)同特征數(shù)據(jù)模型到矢量圖形的數(shù)據(jù)交換。

每一個(gè)繪制的圖形將被保存到一個(gè)Model對(duì)象中，協(xié)同的基本原理是：一個(gè)客戶(hù)端更新圖形后，將更新后的Model通過(guò)socket.io提交到服務(wù)器，由服務(wù)器向其他客戶(hù)端進(jìn)行廣播，再由其他客戶(hù)端對(duì)數(shù)據(jù)進(jìn)行顯示。

（2）矢量圖形繪制及沖突檢測(cè)

圖形的繪制包括圖形對(duì)象的創(chuàng)建、更新、存儲(chǔ)。所有矢量圖形繪制都是基于像素的，它們是矢量圖形的最基本單元。如果能在網(wǎng)頁(yè)中創(chuàng)建一個(gè)最基本的像素單元，使其通過(guò)控制這些像素單元的顯示來(lái)繪制矢量圖形，就方便多了。基于此原理，筆者以DHTML和JavaScript為開(kāi)發(fā)語(yǔ)言，使用寬為lpx，高為lpx的Div對(duì)象作為一個(gè)像素。有了像素單元，所有標(biāo)準(zhǔn)圖形將可以直接應(yīng)用計(jì)算機(jī)圖形學(xué)相關(guān)繪圖算法實(shí)現(xiàn)繪圖。例如，直線將可直接應(yīng)用Bresenham快速畫(huà)直線的算法。簡(jiǎn)單地說(shuō)，就是直接在滿(mǎn)足給定直線方程的坐標(biāo)上繪制像素。據(jù)此類(lèi)推，矩形可由四個(gè)直線方程表示，填充則是在一個(gè)封閉區(qū)域畫(huà)滿(mǎn)像素。

由于當(dāng)前移動(dòng)WEB瀏覽器平臺(tái)純網(wǎng)頁(yè)模式下不存在圖形繪制環(huán)境，不存在基本的圖形庫(kù)，因此需要從底層最基本的矢量繪制開(kāi)始，構(gòu)建相應(yīng)的圖形庫(kù)，主要建立二維基本矢量圖形庫(kù)。基于移動(dòng)WEB瀏覽器網(wǎng)頁(yè)的圖形繪制實(shí)現(xiàn)，性能好壞至關(guān)重要。它一方面與移動(dòng)終端硬件以及瀏覽器的Render Engine緊密相關(guān)，另一方面與圖形的實(shí)現(xiàn)算法并結(jié)合網(wǎng)頁(yè)元素的特性來(lái)表示一些基本的矢量圖形。這樣能大大減少表示矢量圖形的基本像素網(wǎng)頁(yè)元素，性能優(yōu)化主要做這方面的工作。這個(gè)過(guò)程可以在瀏覽器支持和安全允許的前提下，借用HTML5的canvas圖形引擎功能，直接進(jìn)行圖形繪制和性能優(yōu)化的實(shí)現(xiàn)。

在網(wǎng)頁(yè)上，支持二維矢量圖形協(xié)同繪制平臺(tái)中所定義的圖元的操作有矢量圖形繪制、選擇、修改、移動(dòng)、刪除等操作。假設(shè)我們定義矢量圖形的操作集合OP，OP={P，S，C，M，D}，其中P代表繪制，S代表選擇，C代表修改，M代表移動(dòng)，D代表刪除。

針對(duì)網(wǎng)頁(yè)矢量圖形繪制環(huán)境下并發(fā)操作的沖突檢測(cè)，設(shè)用戶(hù)Ui，執(zhí)行操作為OPi，該操作所作用的矢量圖形記為Gi，用戶(hù)Uj，執(zhí)行操作為OPj，該操作所作用的特征對(duì)象記為Gj，（Gi可以等于Gj），通過(guò)以下步驟檢測(cè)并發(fā)沖突：①如果Ui操作是繪制矢量圖形Gi，OPi=P，則Uj的操作不與其他用戶(hù)產(chǎn)生沖突，檢測(cè)結(jié)束。②如果Ui操作是選擇矢量圖形Gi，OPi=S，則Uj的操作與其他用戶(hù)操作不產(chǎn)生沖突，沖突檢測(cè)結(jié)束。③如果Ui操作是修改矢量圖形Gi，則Uj與所有與其并發(fā)的且對(duì)Gi的操作OPj且OPj不屬于{P，S}，產(chǎn)生操作沖突，沖突檢測(cè)結(jié)束。④如果Ui操作是移動(dòng)或刪除矢量圖形Gi，則Uj與所有與其并發(fā)的且對(duì)Gi的操作OPj且OPj不屬于{P，S}，產(chǎn)生操作沖突，沖突檢測(cè)結(jié)束。

（3）多用戶(hù)并發(fā)控制策略

多用戶(hù)同時(shí)操作有很大可能會(huì)產(chǎn)生沖突，因此需要并發(fā)控制。在分布式系統(tǒng)、多線程系統(tǒng)中，并發(fā)控制是普遍需要解決的問(wèn)題，它也是計(jì)算機(jī)協(xié)同系統(tǒng)需要解決的關(guān)鍵技術(shù)之一。在實(shí)時(shí)計(jì)算機(jī)協(xié)同系統(tǒng)中，會(huì)存在多個(gè)不同用戶(hù)都需要訪問(wèn)的共享對(duì)象（如云黑板中的矢量圖形圖元等），因此系統(tǒng)需要對(duì)多個(gè)不同用戶(hù)訪問(wèn)共享對(duì)象的操作進(jìn)行實(shí)時(shí)響應(yīng)，這樣才能達(dá)到“你見(jiàn)即我見(jiàn)”的效果。由于多個(gè)不同用戶(hù)同時(shí)對(duì)一個(gè)矢量圖形的并發(fā)訪問(wèn)是不可避免的，因此會(huì)發(fā)生不可避免的沖突，并發(fā)控制策略是為保證數(shù)據(jù)的一致性而必須采取合適的策略。其主要目標(biāo)是保證在對(duì)共享資源并發(fā)訪問(wèn)的情況下，能正確地操作共享資源。筆者主要采用對(duì)矢量圖形加鎖和協(xié)同感知技術(shù)，來(lái)解決和避免多用戶(hù)同時(shí)操作矢圖元產(chǎn)生的沖突。

對(duì)所繪制的矢量圖形加鎖是保證數(shù)據(jù)一致性的常用手段，它是對(duì)用戶(hù)訪問(wèn)的共享對(duì)象進(jìn)行加鎖和解鎖操作。用戶(hù)在對(duì)矢量圖形進(jìn)行繪制、修改、刪除操作之前，必須先對(duì)該矢量圖形對(duì)象進(jìn)行加鎖，防止其他用戶(hù)進(jìn)行操作，從而滿(mǎn)足用戶(hù)對(duì)矢量圖形對(duì)象進(jìn)行操作的要求。其他用戶(hù)在訪問(wèn)加鎖以后的矢量圖形對(duì)象時(shí)，如果得不到該對(duì)象的訪問(wèn)權(quán)限，就必須等待，直到用戶(hù)釋放控制此矢量圖形對(duì)象的鎖后，才能訪問(wèn)。

所謂協(xié)同感知是指群體協(xié)作環(huán)境能夠在不影響其他參與者協(xié)同工作的情況下，將一個(gè)參與者的信息傳遞給各協(xié)作參與者，使得各協(xié)作參與者能夠彼此感知到對(duì)方的狀態(tài)信息。其目的是模擬現(xiàn)實(shí)世界的協(xié)作過(guò)程，讓參與協(xié)作的人在計(jì)算機(jī)環(huán)境中了解其他人的活動(dòng)，從而為自己的活動(dòng)提供一個(gè)“上下文”環(huán)境，消除由空間上的分布帶來(lái)的割裂感。

筆者將上述兩種方法融合，應(yīng)用到云黑板系統(tǒng)中，實(shí)現(xiàn)了當(dāng)一個(gè)用戶(hù)編輯某個(gè)對(duì)象以后，整個(gè)編輯過(guò)程將被協(xié)同，其他用戶(hù)可以看到其編輯過(guò)程，但不能獲得圖形對(duì)象的編輯焦點(diǎn)，需要等待當(dāng)前編輯用戶(hù)完成編輯才能操作。

● 系統(tǒng)實(shí)例

云黑板系統(tǒng)采用Nodejs服務(wù)器，當(dāng)網(wǎng)絡(luò)正常連接到服務(wù)器且登錄成功后，可以直接選擇工具箱中的內(nèi)容協(xié)同作圖。圖3中左圖即為協(xié)同作圖效果圖，顯示了當(dāng)前參與協(xié)同的用戶(hù)。圖3中右圖為用戶(hù)聊天的實(shí)現(xiàn)效果。用戶(hù)可以隨時(shí)交流，獲取資源，體現(xiàn)移動(dòng)自主學(xué)習(xí)。

● 總結(jié)

云黑板系統(tǒng)不僅可作為遠(yuǎn)程教育教學(xué)平臺(tái)，也可推廣到各種教育培訓(xùn)機(jī)構(gòu)中使用，作為企業(yè)集團(tuán)培訓(xùn)、企業(yè)客戶(hù)培訓(xùn)等移動(dòng)終端輔助產(chǎn)品。終端用戶(hù)可以是教育人員，也可以是企業(yè)客戶(hù)以及其他類(lèi)型參與人員。該系統(tǒng)既吸收了傳統(tǒng)遠(yuǎn)程教育平臺(tái)優(yōu)點(diǎn)，又突出了移動(dòng)終端的優(yōu)勢(shì)，真正做到了施教者與受教者能夠不受時(shí)空限制，隨時(shí)隨地學(xué)習(xí)。可見(jiàn)，面向移動(dòng)終端的云黑板系統(tǒng)使用范圍廣泛，應(yīng)用前景廣闊。

參考文獻(xiàn)：

[1]馬麗潔.遠(yuǎn)程教育與當(dāng)代信息技術(shù)的整合研究[J].成人教育，2016（1）：19-22.

[2]孫立會(huì).開(kāi)放教育基本特征的變遷——兼議MOOC之本源性問(wèn)題[J].遠(yuǎn)程教育雜志，2014（2）：30-38.

[3]徐苑苑，張際平.基于云架構(gòu)的網(wǎng)絡(luò)教學(xué)平臺(tái)設(shè)計(jì)與實(shí)現(xiàn)[J].遠(yuǎn)程教育雜志，2013（03）：71-78.

[4]張波.基于對(duì)象視圖模型WebView的Web應(yīng)用框架[J].軟件學(xué)報(bào)，2002（10）：1985-1990.

[5]胡晶.基于HTML5的Web移動(dòng)應(yīng)用開(kāi)發(fā)研究[J].工業(yè)控制計(jì)算機(jī)，2014（10）：80-81.

[6]黃經(jīng)贏.基于Socket.io+Node.js+Redis構(gòu)建高效即時(shí)通訊系統(tǒng)[J].現(xiàn)代計(jì)算機(jī)（專(zhuān)業(yè)版），2014（13）：62-69.

[7]許會(huì)元.NodeJS的異步非阻塞I/O研究[J].工業(yè)控制計(jì)算機(jī)，2015（3）：127-129.

[8]陳嶺.基于Web的實(shí)時(shí)協(xié)同編輯系統(tǒng)中的一致性控制[J].計(jì)算機(jī)研究與發(fā)展，2001（12）：1505-1511.

[9]王越.移動(dòng)互聯(lián)網(wǎng)時(shí)代協(xié)同感知技術(shù)研究[J].河南科技，2015（5）：9-11.

作者簡(jiǎn)介：應(yīng)悅，副研究員，碩士，研究方向?yàn)檫h(yuǎn)程教育與技術(shù)發(fā)展；簡(jiǎn)琤峰，副教授、博士，研究方向?yàn)樵朴?jì)算、CAD。

基金項(xiàng)目：本文為浙江省科技廳公益技術(shù)研究工業(yè)項(xiàng)目“支持移動(dòng)終端手勢(shì)識(shí)別的‘云黑板’教學(xué)平臺(tái)”（項(xiàng)目編號(hào)：2014C31068）的部分研究成果。