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

【關鍵詞】 自動播出系統(tǒng) 跨平臺 多終端 HTML5 WebSocket

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

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

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

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

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

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

一般來說，一個自動播出系統(tǒng)由四部分組成：需要被控制的設備、設備控制服務器、數(shù)據(jù)庫、各種應用客戶端，圖1說明了它們之間的關系。

（1）需要被控制的設備

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

（2）設備控制服務器

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

而且為了保證設備控制服務器的可靠運行，采用主、備的雙設備控制服務器是更好的選擇。

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

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

（4）各種應用客戶端

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

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

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

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

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

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

（1）設備控制服務器的實現(xiàn)

要實現(xiàn)設備控制服務器，一般來說包括三層：設備驅(qū)動層、事務層、服務層。

設備驅(qū)動層

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

設備管理主要用來分類管理各種設備，使得可以很方便得在業(yè)務層進行控制。

設備協(xié)議是指對不同類型的設備來說，有不同的控制協(xié)議，比如控制視屏服務器的VDCP協(xié)議，控制VTR的SONY VTR協(xié)議，控制矩陣的矩陣協(xié)議等等。

設備驅(qū)動是對某一型號設備的具體支持，它從某一設備協(xié)議繼承而來，可能受通用協(xié)議的控制，但也有自己的一些特性。

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

事務層

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

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

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

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

服務層

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

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

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

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

界面層

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

控制層

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

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

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

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

1. 新的挑戰(zhàn)

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

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

2. 新的技術HTML5與WebSocket

有新的挑戰(zhàn)，就有新的技術的出現(xiàn)。HTML5就是這樣的一種新技術。HTML5是谷歌、蘋果、諾基亞、中國移動等幾百家公司一起醞釀的W3C推薦的新一代的網(wǎng)絡標準，一個公開的標準。

HTML5是跨平臺的、支持多終端的，因為目前PC、手機、平板上的主流瀏覽器大都主持HTML5，比如不但蘋果的Safari支持HTML5， FireFox， Chrome， Opera等主流瀏覽器也都支持HTML5，微軟的IE9開始支持部分HTML5特性，從IE10開始對HTML5有完善的支持。

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

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

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

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

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

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

（2）WebSocket的目標與優(yōu)點

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

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

（3）WebSocket的原理

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

（4）WebSocket客戶端

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

在客戶端，很容易用JavaScript來實現(xiàn)，請參考下面的代碼：

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

（5）WebSocket服務器端

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

當用戶實現(xiàn)WebSocket服務器段時，主要處理三部分信息：

握手信息

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

WebSocket頭信息

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

定制的通訊協(xié)議

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

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

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

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

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

1. 系統(tǒng)部署

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

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

2. 設備控制服務器的實現(xiàn)

對設備控制服務器來說，與C/S架構(gòu)的設備控制服務器相比，唯一的變化是將標準的Socket服務替換成WebSocket服務。

從具體實現(xiàn)來說，就是在客戶應用的連接建立以后，服務器與客戶端多了一個握手的過程，用來保證通訊的安全，在其后的數(shù)據(jù)通訊中，數(shù)據(jù)包多了一個WebSocket協(xié)議數(shù)據(jù)頭。其他處理與標準Socket通訊完全相同。

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

3. 應用端的實現(xiàn)

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

一般來說應用端包含三部分：HTML5頁面，CSS界面裝飾，JavaScript邏輯控制。

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

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

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

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

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

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

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

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

（2）跨平臺與多終端

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

（3）易于維護升級

由于新的應用層發(fā)表在Web服務器上，維護升級方便，不需要每個終端進行一一維護升級。

（4）易于集成擴展

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

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

對設備控制服務器來說，只要將標準的Socket服務換成WebSocket服務就可以重構(gòu)原來的系統(tǒng)。對應用端來說，不管公司的JavaScript函數(shù)庫，還是CSS的頁面裝飾庫，都可以進行重用。

（6）分工的明確化

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

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

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

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

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

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

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

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

（2）HTML5的未知性

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

（3）安全問題

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

五. 結(jié)束語

HTML5是發(fā)展中的新技術，學習它，應用它，使得您一直走在新技術的前列。 BP

縮寫詞

參考文獻：

[1] 孫揚聲. 自動控制理論. 第三版. 北京： 中國電力出版社， 2004年：第1頁

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

[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