跨平臺(tái)多終端自動(dòng)播出系統(tǒng)的研究與實(shí)現(xiàn)

【摘要】 本文探討了如何實(shí)現(xiàn)C/S、B/S架構(gòu)的自動(dòng)播出系統(tǒng)，比較兩種實(shí)現(xiàn)的優(yōu)缺點(diǎn)，并詳細(xì)介紹了如何采用HTML5的全新特性WebSocket來(lái)實(shí)現(xiàn)B/S架構(gòu)自動(dòng)播出系統(tǒng)，實(shí)現(xiàn)對(duì)跨平臺(tái)、多終端的支持。

【關(guān)鍵詞】 自動(dòng)播出系統(tǒng) 跨平臺(tái) 多終端 HTML5 WebSocket

一. 什么是自動(dòng)播出系統(tǒng)

自動(dòng)控制是指無(wú)需人經(jīng)常直接參與，而是通過(guò)對(duì)某一對(duì)象施加合乎目的的作用，以使其產(chǎn)生所希望的行為或變化的控制[1]。

廣播行業(yè)的自動(dòng)播出系統(tǒng)跟傳統(tǒng)的自動(dòng)控制有所區(qū)別，它需要軟件和硬件密切配合，才能實(shí)現(xiàn)。因?yàn)樵谡麄€(gè)廣播播出過(guò)程之中，有不同功能的不同類型的設(shè)備參與，比如視頻服務(wù)器、矩陣、主控臺(tái)等等，而且，這樣的設(shè)備有可能來(lái)源于不同的廠商，如果是完全由人工控制，難度大、不易同步協(xié)調(diào)，而且安全性得不到保障，自動(dòng)播出系統(tǒng)的出現(xiàn)使得操作員可以通過(guò)一個(gè)專門的系統(tǒng)對(duì)所有設(shè)備進(jìn)行統(tǒng)一的控制與監(jiān)視。

二. C/S自動(dòng)播出系統(tǒng)的實(shí)現(xiàn)

怎樣實(shí)現(xiàn)一個(gè)廣播行業(yè)的自動(dòng)播出系統(tǒng)呢？我們從系統(tǒng)部署、系統(tǒng)架構(gòu)選擇、系統(tǒng)實(shí)現(xiàn)三方面來(lái)詳細(xì)分析。

1. 自動(dòng)播出系統(tǒng)部署

一般來(lái)說(shuō)，一個(gè)自動(dòng)播出系統(tǒng)由四部分組成：需要被控制的設(shè)備、設(shè)備控制服務(wù)器、數(shù)據(jù)庫(kù)、各種應(yīng)用客戶端，圖1說(shuō)明了它們之間的關(guān)系。

（1）需要被控制的設(shè)備

該部分包括各種需要參與自動(dòng)播出的設(shè)備，比如視頻服務(wù)器，矩陣，主控臺(tái)，VTR，字幕機(jī)，各種音頻卡、視頻板等等，它們能夠通過(guò)網(wǎng)絡(luò)、或RS422串口、或GPI接口進(jìn)行控制。

（2）設(shè)備控制服務(wù)器

設(shè)備控制服務(wù)器是自動(dòng)播出系統(tǒng)的核心，一般來(lái)說(shuō)設(shè)備控制服務(wù)器屬于兩個(gè)網(wǎng)絡(luò)：一個(gè)是設(shè)備網(wǎng)，設(shè)備控制服務(wù)器在這個(gè)網(wǎng)絡(luò)上能找到需要控制的所有設(shè)備，通過(guò)網(wǎng)絡(luò)協(xié)議、RS422串口協(xié)議、或者GPI接口發(fā)送控制命令到具體設(shè)備，從而能夠控制設(shè)備的運(yùn)行、監(jiān)視設(shè)備的狀態(tài)；另一個(gè)是應(yīng)用網(wǎng)，在這個(gè)網(wǎng)絡(luò)上，各種的應(yīng)用程序能夠通過(guò)設(shè)備控制服務(wù)器協(xié)議與設(shè)備控制服務(wù)器進(jìn)行通訊。為了安全起見(jiàn)、同時(shí)避免網(wǎng)絡(luò)阻塞，設(shè)備網(wǎng)與應(yīng)用網(wǎng)最好保持物理上的獨(dú)立。

而且為了保證設(shè)備控制服務(wù)器的可靠運(yùn)行，采用主、備的雙設(shè)備控制服務(wù)器是更好的選擇。

（3）數(shù)據(jù)庫(kù)

該數(shù)據(jù)庫(kù)包含應(yīng)用中的各種數(shù)據(jù)，比如用戶信息、業(yè)務(wù)數(shù)據(jù)、媒體元數(shù)據(jù)等等。這些數(shù)據(jù)既可以給應(yīng)用提供完善的信息，也可以避免應(yīng)用頻繁操作設(shè)備，降低設(shè)備的性能，比如媒體元數(shù)據(jù)。

（4）各種應(yīng)用客戶端

該部分包括各種各樣的應(yīng)用，比如播放列表、媒體錄入、設(shè)備狀態(tài)監(jiān)視等等，而且隨著需求的變更，應(yīng)用程序會(huì)不停變化或增加。

2. 軟件架構(gòu)的選擇

通常來(lái)說(shuō)，一個(gè)軟件有C/S或B/S兩種架構(gòu)可以選擇。B/S是Browser/Server，指瀏覽器和服務(wù)器端，在客戶機(jī)端不用安裝專門的軟件，只要一個(gè)瀏覽器即可，屬于瘦客戶端。C/S是Client/Server， 指客戶機(jī)和服務(wù)器，在客戶機(jī)需要安裝客戶端軟件及相應(yīng)環(huán)境后，才能訪問(wèn)服務(wù)器，屬于胖客戶端。

表1[2]對(duì)B/S和C/S優(yōu)缺點(diǎn)進(jìn)行了比較，由于C/S架構(gòu)的實(shí)時(shí)性能高且穩(wěn)定，C/S成了自動(dòng)播出系統(tǒng)的不二之選。

3. C/S架構(gòu)自動(dòng)播出系統(tǒng)的實(shí)現(xiàn)

在選定了C/S的軟件架構(gòu)后，接下來(lái)介紹如何實(shí)現(xiàn)自動(dòng)播出系統(tǒng)的設(shè)備控制服務(wù)器與客戶端。

（1）設(shè)備控制服務(wù)器的實(shí)現(xiàn)

要實(shí)現(xiàn)設(shè)備控制服務(wù)器，一般來(lái)說(shuō)包括三層：設(shè)備驅(qū)動(dòng)層、事務(wù)層、服務(wù)層。

設(shè)備驅(qū)動(dòng)層

這一層包括三部分：設(shè)備管理，設(shè)備協(xié)議，設(shè)備驅(qū)動(dòng)。

設(shè)備管理主要用來(lái)分類管理各種設(shè)備，使得可以很方便得在業(yè)務(wù)層進(jìn)行控制。

設(shè)備協(xié)議是指對(duì)不同類型的設(shè)備來(lái)說(shuō)，有不同的控制協(xié)議，比如控制視屏服務(wù)器的VDCP協(xié)議，控制VTR的SONY VTR協(xié)議，控制矩陣的矩陣協(xié)議等等。

設(shè)備驅(qū)動(dòng)是對(duì)某一型號(hào)設(shè)備的具體支持，它從某一設(shè)備協(xié)議繼承而來(lái)，可能受通用協(xié)議的控制，但也有自己的一些特性。

設(shè)備驅(qū)動(dòng)層是設(shè)備控制服務(wù)器的基礎(chǔ)，只有在設(shè)備驅(qū)動(dòng)層正確地工作的前提下，自動(dòng)播出系統(tǒng)才有可靠運(yùn)行的可能。

事務(wù)層

這一層包括設(shè)備控制服務(wù)器能夠提供的各種事務(wù)處理能力，比如播放列表、設(shè)備狀態(tài)監(jiān)視、媒體服務(wù)等。

播放列表主要用于自動(dòng)播出，通過(guò)維護(hù)一個(gè)串行的列表，使得節(jié)目可以一個(gè)接一個(gè)得連續(xù)自動(dòng)播出，避免繁瑣的操作，減少錯(cuò)誤的發(fā)生。

設(shè)備狀態(tài)監(jiān)視是一個(gè)非常重要的部分，這一部分通過(guò)對(duì)設(shè)備狀態(tài)的監(jiān)視，預(yù)防播出事故，即時(shí)通知管理員進(jìn)行維護(hù)與更新，就像汽車的胎壓監(jiān)控儀一樣給予安全行駛的保障。

媒體服務(wù)保證設(shè)備的媒體信息即時(shí)更新，比如視頻服務(wù)器的媒體信息，并提供方便的方式可以進(jìn)行媒體錄入。更進(jìn)一步的是，可以提供全局媒體服務(wù)，在不同的地方可以共享媒體，快捷方便得進(jìn)行媒體傳輸?shù)鹊取?/p>

服務(wù)層

這一層主要給各種應(yīng)用客戶端提供服務(wù)，包括兩部分。第一部分是在標(biāo)準(zhǔn)的Socket端口上提供服務(wù)，接受來(lái)自應(yīng)用客戶端的命令；第二部分是將命令按照自動(dòng)播出系統(tǒng)的協(xié)議將其轉(zhuǎn)換成具體的請(qǐng)求，傳遞給事務(wù)層進(jìn)行具體的處理。

圖2介紹了服務(wù)器端的結(jié)構(gòu)。

（2）客戶端的實(shí)現(xiàn)

客戶端的結(jié)構(gòu)相對(duì)來(lái)說(shuō)比較簡(jiǎn)單，但是實(shí)現(xiàn)相對(duì)繁瑣。一般來(lái)說(shuō)客戶端包括界面層與控制層。

界面層

這一部分看起來(lái)比較簡(jiǎn)單，但根據(jù)編程語(yǔ)言的不同，有不同的實(shí)現(xiàn)方式，難易程度也不同，比如VC、C#、以及Java就有不同的實(shí)現(xiàn)策略。總體來(lái)說(shuō)，這一部分就是提供一個(gè)易于操作的界面，使得用戶可以方便地控制播放編列、查看設(shè)備狀態(tài)、錄入新的媒體等。

控制層

這一層分為兩部分，一部分是將界面事件轉(zhuǎn)換成自動(dòng)播出系統(tǒng)命令，并將其發(fā)送到設(shè)備控制服務(wù)器；另一部分是數(shù)據(jù)庫(kù)部分，提供業(yè)務(wù)需要的數(shù)據(jù)，并在恰當(dāng)?shù)臅r(shí)候進(jìn)行更新。

圖3介紹了客戶端的結(jié)構(gòu)。

通過(guò)上面的介紹，一個(gè)C/S架構(gòu)的自動(dòng)播出系統(tǒng)構(gòu)建完畢，它有高的實(shí)時(shí)性，功能強(qiáng)大，穩(wěn)定高效，可以用來(lái)實(shí)現(xiàn)絕大部分的自動(dòng)播出系統(tǒng)。

三. 新的挑戰(zhàn)以及新的技術(shù)

1. 新的挑戰(zhàn)

但是隨時(shí)時(shí)代的發(fā)展、技術(shù)的進(jìn)步，C/S架構(gòu)的產(chǎn)品受到越來(lái)越多的挑戰(zhàn)。其中最顯著的就是多終端的挑戰(zhàn)。從剛開(kāi)始的PC，到筆記本，再到現(xiàn)在的手機(jī)與平板電腦，越來(lái)越多的終端要求參與到系統(tǒng)的操作監(jiān)控過(guò)程中，特別是手機(jī)與平板，這兩個(gè)為方便而生的產(chǎn)品。

這樣就要求軟件產(chǎn)品在支持個(gè)人電腦的同時(shí)，也要求能夠在手機(jī)或平板上運(yùn)行，這也意味著軟件產(chǎn)品需要運(yùn)行在不同的操作系統(tǒng)上，比如Android， iOS， Windows， Windows Phone等等。對(duì)C/S架構(gòu)的產(chǎn)品來(lái)說(shuō)，這意味著為每一個(gè)操作系統(tǒng)的終端，必須開(kāi)發(fā)相應(yīng)的客戶端，從而大大提高了開(kāi)發(fā)的成本以及維護(hù)更新的成本。

2. 新的技術(shù)HTML5與WebSocket

有新的挑戰(zhàn)，就有新的技術(shù)的出現(xiàn)。HTML5就是這樣的一種新技術(shù)。HTML5是谷歌、蘋果、諾基亞、中國(guó)移動(dòng)等幾百家公司一起醞釀的W3C推薦的新一代的網(wǎng)絡(luò)標(biāo)準(zhǔn)，一個(gè)公開(kāi)的標(biāo)準(zhǔn)。

HTML5是跨平臺(tái)的、支持多終端的，因?yàn)槟壳癙C、手機(jī)、平板上的主流瀏覽器大都主持HTML5，比如不但蘋果的Safari支持HTML5， FireFox， Chrome， Opera等主流瀏覽器也都支持HTML5，微軟的IE9開(kāi)始支持部分HTML5特性，從IE10開(kāi)始對(duì)HTML5有完善的支持。

HTML5[3]提出了很多的新特性，比如SVG， Canvas， Gealocation， Web Worker等等，使得開(kāi)發(fā)網(wǎng)絡(luò)應(yīng)用簡(jiǎn)單而且功能強(qiáng)大，很多以前只能通過(guò)桌面程序完成的功能也很容易通過(guò)HTML5在Web應(yīng)用中完成。

在HTML5的眾多新特性中，有一個(gè)全新的特性WebSocket[4]。

（1）WebSocket出現(xiàn)的背景

現(xiàn)在，很多網(wǎng)站為了實(shí)現(xiàn)即時(shí)通訊，所用的技術(shù)都是輪詢。 輪詢是在特定的時(shí)間間隔（如每1秒），由瀏覽器對(duì)服務(wù)器發(fā)出HTTP request，然后由服務(wù)器返回最新的數(shù)據(jù)給客戶端的瀏覽器。這種傳統(tǒng)的模式帶來(lái)很明顯的缺點(diǎn)，即瀏覽器需要不斷的向服務(wù)器發(fā)出請(qǐng)求，然而HTTP request 的header非常長(zhǎng)，里面包含的數(shù)據(jù)可能只是很少的一部份，這樣會(huì)占用很多的帶寬和服務(wù)器資源。

而比較新的技術(shù)去做輪詢的效果是Comet，使用了AJAX。這種技術(shù)雖然可達(dá)到雙向通信，但依然需要發(fā)出請(qǐng)求，而且在Comet中，普遍采用了長(zhǎng)鏈接，這也會(huì)大量消耗服務(wù)器帶寬和資源。

面對(duì)這種狀況，HTML5定義了WebSocket協(xié)議，能更好的節(jié)省服務(wù)器資源和帶寬，并達(dá)到實(shí)時(shí)通訊[5]。

（2）WebSocket的目標(biāo)與優(yōu)點(diǎn)

WebSocket規(guī)范的目標(biāo)是在瀏覽器中實(shí)現(xiàn)和服務(wù)器端雙向通信[6]。雙向通信可以拓展瀏覽器上的應(yīng)用類型。這樣使得我們可以在利用Web應(yīng)用的優(yōu)勢(shì)的同時(shí)，可以使用到Socket高效的點(diǎn)對(duì)點(diǎn)通訊方式。

同時(shí)WebSocket服務(wù)器與客戶端之間交換的標(biāo)頭信息很小，大概只有10字節(jié)。而且WebSocket不僅支持純文本的數(shù)據(jù)，而且支持二進(jìn)制的數(shù)據(jù)通訊。

（3）WebSocket的原理

瀏覽器中的網(wǎng)頁(yè)與服務(wù)器的WebSocket的通訊有兩個(gè)過(guò)程，第一個(gè)是握手過(guò)程，瀏覽器發(fā)送一個(gè)類似于http頭的請(qǐng)求給服務(wù)器，服務(wù)器根據(jù)http頭中的信息，生成另外一個(gè)http頭發(fā)送個(gè)客戶端，這樣連接就建立了；第二個(gè)是通訊過(guò)程，每次通訊需要包括WebSocket協(xié)議頭，根據(jù)包長(zhǎng)度的不同，從2到10字節(jié)不等。

（4）WebSocket客戶端

WebScoket客戶端主要需要瀏覽器對(duì)WebSocket的支持。目前大部分最新版的主流瀏覽器已經(jīng)支持WebSocket，比如FireFox，Chrome，Safari等。微軟從IE 10也開(kāi)始支持WebSocket。

在客戶端，很容易用JavaScript來(lái)實(shí)現(xiàn)，請(qǐng)參考下面的代碼：

當(dāng)WebSocket初始化時(shí)，需要一個(gè)網(wǎng)絡(luò)地址，該地址以ws：//或wss：//開(kāi)始，其后是服務(wù)器地址或主機(jī)名，然后服務(wù)端口號(hào)。在客戶端，可以處理onopen、onmessage、onclose、onerror等事件，從而實(shí)現(xiàn)對(duì)服務(wù)器的回應(yīng)的處理。當(dāng)客戶端想向服務(wù)器發(fā)送消息時(shí)，只要調(diào)用send就可以了。

（5）WebSocket服務(wù)器端

目前已經(jīng)有一些Web服務(wù)器支持WebSocket，比如Tomcat，node.js等。同時(shí)由于WebSocket協(xié)議的簡(jiǎn)單性，用戶可以很容易地實(shí)現(xiàn)自己的WebSocket服務(wù)，提供自己訂制的WebSocket通訊服務(wù)。

當(dāng)用戶實(shí)現(xiàn)WebSocket服務(wù)器段時(shí)，主要處理三部分信息：

握手信息

在瀏覽器發(fā)送來(lái)的http握手請(qǐng)求中，包含key信息，服務(wù)器需要根據(jù)key信息，按照協(xié)議的算法，生成另外一個(gè)key，發(fā)送給客戶端，如果key信息不對(duì)，瀏覽器會(huì)拒絕連接。

WebSocket頭信息

WebSocket頭比較簡(jiǎn)單，包括各種標(biāo)志位，掩碼，以及數(shù)據(jù)長(zhǎng)度等。用戶很容易根據(jù)WebSocket協(xié)議將頭信息解析出來(lái)。

定制的通訊協(xié)議

用戶根據(jù)自己的需求，可以定義自己的數(shù)據(jù)結(jié)構(gòu)，定制自己的通訊協(xié)議。

四. 跨平臺(tái)多終端自動(dòng)播出系統(tǒng)的實(shí)現(xiàn)

表1比較了C/S與B/S架構(gòu)的優(yōu)缺點(diǎn)，雖然B/S有著眾多的優(yōu)點(diǎn)，由于C/S具有實(shí)時(shí)性高而且穩(wěn)定的特點(diǎn)，對(duì)自動(dòng)播出系統(tǒng)來(lái)說(shuō)，只能選擇C/S架構(gòu)。

但是HTML5的WebSocket的出現(xiàn)使得這個(gè)變成可能：自動(dòng)播出系統(tǒng)既可以保持穩(wěn)定的高實(shí)時(shí)性，又可以具有B/S系統(tǒng)的跨平臺(tái)、支持多終端的優(yōu)點(diǎn)以及其他眾多優(yōu)點(diǎn)。

下面就從系統(tǒng)部署、系統(tǒng)實(shí)現(xiàn)、系統(tǒng)優(yōu)點(diǎn)、系統(tǒng)挑戰(zhàn)幾方面來(lái)詳細(xì)了解新的B/S框架的自動(dòng)播出系統(tǒng)

1. 系統(tǒng)部署

從系統(tǒng)部署的總體架構(gòu)來(lái)看，新的系統(tǒng)同樣包括四部分：需要被控制的設(shè)備、設(shè)備控制服務(wù)器、數(shù)據(jù)庫(kù)、Web服務(wù)器。唯一的變化就是所有應(yīng)用都將發(fā)布于Web服務(wù)器上，用戶可以通過(guò)各種終端的瀏覽器對(duì)應(yīng)用進(jìn)行訪問(wèn)。應(yīng)用與設(shè)備控制服務(wù)器將通過(guò)WebSocket進(jìn)行通訊，保持以前的點(diǎn)對(duì)點(diǎn)的高穩(wěn)定性以及高實(shí)時(shí)性。

圖5介紹了B/S自動(dòng)播出系統(tǒng)的部署圖。

2. 設(shè)備控制服務(wù)器的實(shí)現(xiàn)

對(duì)設(shè)備控制服務(wù)器來(lái)說(shuō)，與C/S架構(gòu)的設(shè)備控制服務(wù)器相比，唯一的變化是將標(biāo)準(zhǔn)的Socket服務(wù)替換成WebSocket服務(wù)。

從具體實(shí)現(xiàn)來(lái)說(shuō)，就是在客戶應(yīng)用的連接建立以后，服務(wù)器與客戶端多了一個(gè)握手的過(guò)程，用來(lái)保證通訊的安全，在其后的數(shù)據(jù)通訊中，數(shù)據(jù)包多了一個(gè)WebSocket協(xié)議數(shù)據(jù)頭。其他處理與標(biāo)準(zhǔn)Socket通訊完全相同。

圖6介紹了B/S設(shè)備控制服務(wù)器的結(jié)構(gòu)。

3. 應(yīng)用端的實(shí)現(xiàn)

應(yīng)用端相比C/S架構(gòu)的客戶端，有很大的不同。首先所有頁(yè)面發(fā)布于Web服務(wù)器上，所有的維護(hù)更新都是對(duì)Web服務(wù)器上的內(nèi)容進(jìn)行維護(hù)更新。客戶端不再需要安裝任何程序，不再受平臺(tái)、終端的限制，只要有一個(gè)瀏覽器，就可以實(shí)現(xiàn)對(duì)系統(tǒng)的訪問(wèn)，從而操作播放列表，查看設(shè)備狀態(tài)，進(jìn)行媒體錄入等。

一般來(lái)說(shuō)應(yīng)用端包含三部分：HTML5頁(yè)面，CSS界面裝飾，JavaScript邏輯控制。

HTML5頁(yè)面是界面部分，包括應(yīng)用需要的各種顯示信息、控件等等。

CSS界面裝飾決定了HTML5頁(yè)面怎么樣進(jìn)行顯示，而且對(duì)不同的終端，由于分辨率的不同，可能需要不同的CSS來(lái)對(duì)HTML5頁(yè)面進(jìn)行裝飾。同時(shí)可能用到公司的統(tǒng)一CSS庫(kù)，這樣保證公司產(chǎn)品風(fēng)格的一致性。

JavaScript邏輯控制是應(yīng)用端的核心，不但包含了與Web服務(wù)器的通訊、數(shù)據(jù)庫(kù)的通訊，而且包括與設(shè)備控制服務(wù)器的WebSocket通訊。當(dāng)然，在這一部分，可以使用已經(jīng)存在的通用庫(kù)，如果jQuery庫(kù)等使代碼變得簡(jiǎn)單；也可以使用公司的通用函數(shù)庫(kù)，重用公司的已有代碼。

圖6介紹了B/S應(yīng)用端的結(jié)構(gòu)。

4. 系統(tǒng)的優(yōu)點(diǎn)

基于HTML5的WebSocket的B/S自動(dòng)播出系統(tǒng)具有以下優(yōu)點(diǎn)：

（1）像C/S系統(tǒng)一樣高效穩(wěn)定

從設(shè)備控制服務(wù)器的實(shí)現(xiàn)可以看出，跟C/S架構(gòu)的自動(dòng)播出系統(tǒng)一樣，它具有高實(shí)時(shí)性、穩(wěn)定、功能強(qiáng)大的優(yōu)點(diǎn)，滿足廣播播出的需求。

（2）跨平臺(tái)與多終端

新系統(tǒng)可以在不同的平臺(tái)下使用， 比如Windows， Linux， Andriod， iOS等，這意味著它可以在不同的終端中使用，比如PC， 平板， 手機(jī)等。

（3）易于維護(hù)升級(jí)

由于新的應(yīng)用層發(fā)表在Web服務(wù)器上，維護(hù)升級(jí)方便，不需要每個(gè)終端進(jìn)行一一維護(hù)升級(jí)。

（4）易于集成擴(kuò)展

由于是Web應(yīng)用，可以很方便得跟已有的業(yè)務(wù)系統(tǒng)進(jìn)行集成，或者根據(jù)新的需求擴(kuò)展出新的應(yīng)用。比如跟已有的廣告系統(tǒng)、編單系統(tǒng)、審核系統(tǒng)等進(jìn)行集成。

（5）易于重構(gòu)與重用

對(duì)設(shè)備控制服務(wù)器來(lái)說(shuō)，只要將標(biāo)準(zhǔn)的Socket服務(wù)換成WebSocket服務(wù)就可以重構(gòu)原來(lái)的系統(tǒng)。對(duì)應(yīng)用端來(lái)說(shuō)，不管公司的JavaScript函數(shù)庫(kù)，還是CSS的頁(yè)面裝飾庫(kù)，都可以進(jìn)行重用。

（6）分工的明確化

對(duì)于產(chǎn)品設(shè)計(jì)來(lái)說(shuō)，主要關(guān)心頁(yè)面的功能，也就是HTML5頁(yè)面內(nèi)容；對(duì)于UI來(lái)說(shuō)，主要關(guān)心CSS的裝飾效果，而再也不要擔(dān)心自己設(shè)計(jì)出漂亮的頁(yè)面，但是程序員實(shí)現(xiàn)不出來(lái)；對(duì)于程序員來(lái)說(shuō)，只要關(guān)心JavaScript的邏輯部分是否正確，從而從煩人的界面渲染中釋放出來(lái)。

同時(shí)分工的明確化可以提高開(kāi)發(fā)的效率，縮短開(kāi)發(fā)周期，更快地交付客戶定制需求等.

（7）易于公司產(chǎn)品風(fēng)格的統(tǒng)一

一般來(lái)說(shuō)，一個(gè)公司的產(chǎn)品需要能夠保持一樣的風(fēng)格。在新系統(tǒng)中，只要用到公司的通用CSS風(fēng)格庫(kù)，就可以保持一致的風(fēng)格，不需要額外的工作，降低開(kāi)發(fā)的成本。

5. 系統(tǒng)的挑戰(zhàn)

由于HTML5與WebSocket是新的技術(shù)，在開(kāi)發(fā)這樣的系統(tǒng)時(shí)也面臨一些挑戰(zhàn)：

（1）瀏覽器支持的不確定性

不同的瀏覽器對(duì)HTML5的支持不盡相同。所以同一個(gè)頁(yè)面在不同的瀏覽器中可能有不同的表現(xiàn)。這就要求我們?cè)陧?yè)面的開(kāi)發(fā)過(guò)程中，需要考慮到這種差異性，使得產(chǎn)品具有良好的兼容性。

（2）HTML5的未知性

HTML5的標(biāo)準(zhǔn)并沒(méi)有完全的確定，它還在不停的完善中，所以它有著一些不確定因素。據(jù)估計(jì)，2012年HTML5才會(huì)推出建議候選版，并在2022年才會(huì)成為W3C推薦標(biāo)準(zhǔn)。這就要求我們要關(guān)注標(biāo)準(zhǔn)的變更，使得產(chǎn)品適應(yīng)標(biāo)準(zhǔn)的變更。

（3）安全問(wèn)題

首先，作為一個(gè)網(wǎng)絡(luò)系統(tǒng)，會(huì)遇到到傳統(tǒng)的網(wǎng)絡(luò)安全問(wèn)題威脅，比如黑客攻擊。其次作為一個(gè)廣播系統(tǒng)，要保證設(shè)備的安全性，也就是設(shè)備被正確的人監(jiān)視與控制。所以，當(dāng)我們開(kāi)始設(shè)計(jì)系統(tǒng)時(shí)，就要有完善的安全策略以保證系統(tǒng)的安全性。除了一般C/S架構(gòu)系統(tǒng)的安全措施，如服務(wù)器冗余備份、設(shè)備網(wǎng)和應(yīng)用網(wǎng)的物理分離、用戶權(quán)限管理、歷史操作日志以外，針對(duì)B/S系統(tǒng)還需要防火墻、VPN等措施，保證遠(yuǎn)程操作、控制的安全性。

五. 結(jié)束語(yǔ)

HTML5是發(fā)展中的新技術(shù)，學(xué)習(xí)它，應(yīng)用它，使得您一直走在新技術(shù)的前列。 BP

縮寫詞

參考文獻(xiàn)：

[1] 孫揚(yáng)聲. 自動(dòng)控制理論. 第三版. 北京： 中國(guó)電力出版社， 2004年：第1頁(yè)

[2] 魯春燕，孫 娟. 淺析C/S模式和B/S模式的優(yōu)缺點(diǎn). 福建電腦， 2008年， 第6期：第87頁(yè)

[3] HTML5 Draft. 2012-03-29. [2012-10-02] http：//www.w3.org/TR/html5/.

[4] The WebSocket protocol draft-hixie-thewebsocketprotocol-76. 2010-05-06.

[2012-10-02] http：//tools.ietf.org/html/draft-hixie-thewebsocketprotocol-76

[5] WebSocket. 2012-10-21. [2012-11-03] http：//zh.wikipedia.org/zh-cn/WebSocket

[6] WebSocket. 2012-10-24. [2012-11-03] http：//baike.baidu.com/view/3623887.htm