嵌入式Web視頻點播系統(tǒng)實現(xiàn)方法

2019-11-18 20:21:16

字體：大中小

供稿：網(wǎng)友

嵌入式Web視頻點播系統(tǒng)實現(xiàn)方法    tttk（原作）

關(guān)鍵字     RealPlayer，嵌入式、流媒體，網(wǎng)絡(luò)傳輸，php，DHTML，ActiveX


       近年來，視頻點播VOD（Video on Demand）的名字在媒體上出現(xiàn)得越來越多。VOD技術(shù)使人們可以根據(jù)自己的興趣，不用借助錄像機、影碟機、有線電視而在電腦或電視上自由地點播節(jié)目庫中的視頻節(jié)目和信息，是可以對視頻節(jié)目內(nèi)容進行自由選擇的交互式系統(tǒng)。
VOD的本質(zhì)是信息的使用者根據(jù)自己的需求主動獲得多媒體信息，它區(qū)別于信息發(fā)布的最大不同:一是主動性、二是選擇性。從某種意義上說這是信息的接受者根據(jù)自身需要進行自我完善和自我發(fā)展的方式，這種方式在當(dāng)今的信息社會中將越來越符合信息資源消費者的深層需要，可以說VOD是信息獲取的未來主流方式在多媒體視音頻方面的表現(xiàn)。VOD的概念將會在信息獲取的領(lǐng)域快速擴展,具有無限廣闊的發(fā)展前景。

【背景】

    筆者所在的單位建設(shè)有一個內(nèi)部網(wǎng)站，為了進一步提高網(wǎng)絡(luò)的可用性，完善網(wǎng)站的功能，決定在網(wǎng)絡(luò)上提供視頻點播功能。經(jīng)過一段時間的摸索和比較，筆者最后選擇了RealSystem公司的RealPlayer作為視頻文件的播放工具，主要基于以下幾點考慮：

1、  RealPlayer 支持當(dāng)今絕大多數(shù)的音視頻流媒體格式，包括當(dāng)前流行的MP3等音頻媒質(zhì)；

2、  RealPlayer 默認的.rm格式在保證播放質(zhì)量的同時，文件壓縮比高，使其更利于網(wǎng)絡(luò)傳輸；

3、  RealPlayer在Internet上擁有廣泛的用戶群和服務(wù)商支持。

可供選擇的還有Microsoft的MediaPlayer、APPLE 的QuickTime等。具體請參看“搜新網(wǎng)”評測文章：《三大主流流媒體技術(shù)對比》（http://www.souxin.com/stream/txt/3_stream_comp/www.souxin.com.htm）

【播放方式的選擇】

一般而言，安裝好RealPlayer之后，有兩種方式可供選擇來連接視頻文件。一種是直接在Web頁面上提供視頻文件的URL地址，當(dāng)用戶點擊鏈接時，RealPlayer自動識別并實時連接進行播放；第二種方法是通過ActiveX控件方式在Web頁面中嵌入RealPlayer對象，并通過DHTML為內(nèi)嵌對象動態(tài)指定視頻流URL，從而為視頻播放提供了一個統(tǒng)一的友好界面。

前一種方法對于設(shè)計者來說相對比較簡單，只需要提供視頻文件的播放路徑。RealPlayer的熟練用戶，還可以通過自定義RealPlayer的播放方式、下載視覺插件、添加到收藏夾等方式進行視頻管理。但這種方式也存在以下幾點缺陷：

1、對于含有中文路徑和中文名的視頻文件，瀏覽器并不能很好支持，常常出現(xiàn)找不到文件等錯誤信息。

2、需要系統(tǒng)進行文件關(guān)聯(lián)，如果文件關(guān)聯(lián)出錯，瀏覽器將無所適從。

3、對終端用戶來說，往往希望看到統(tǒng)一的播放界面，而不是彈出式播放。

通過Web嵌入式視頻流管理，可以把用戶端的操作請求減少到最?。ㄓ脩糁恍韬唵蔚陌惭bRealPlayer播放器）。如果再輔以精心的美工設(shè)計，還可以按照設(shè)計者的意愿定制出精美大方的播放界面。

【基本概念】

在進行設(shè)計之前，我們先來了解一些相關(guān)的基本概念。

1、<object>、<embed>標簽

<object>是Microsoft在IE4.0之后推出的，用來替代<embed>標簽的對象定義標簽(IE仍然支持<embed>)，通過classid屬性定義相應(yīng)的對象類型。<embed>標簽是Netscape瀏覽器支持的對象定義標簽。如果開發(fā)者需要同時獲得IE和NetScape兩種瀏覽器用戶的支持，最好使用<embed>標簽。

2、定義ram文件

ram格式文件同rm文件一樣，也是RealPlayer所支持的視頻文件壓縮格式，所不同的是ram文件可以僅簡單的包括視頻文件的URL地址。也就是說，ram文件可以為簡單的文本格式，每一行定義一個視頻文件的URL地址。

筆者在測試時發(fā)現(xiàn)，嵌入式RealPlayer在播放視頻文件時，一般采用把視頻文件整個下載到本地然后進行播放。這對于較大的視頻文件來說，速度讓人難以忍受。解決這個問題的方法，一是把視頻文件簡單的分割成大小適中的小文件分段播放（由于 REAL 公司對 RM 格式的實行“封閉管理”，所以 RM 到目前為止還不能像 MPEG 等視頻文件一樣用視頻軟件自由的編輯）；另外一種就是采用ram文件。RealPlayer簡單的下載文本格式的ram文件，然后取出其中的真實地址，然后自動連接到網(wǎng)絡(luò)進行實時的點對點播放。其缺點是增加了服務(wù)器負擔(dān)。

類似的，Microsoft Media Player采用asx格式來定義asf文件。

3、DHTML

    DHTML是Dynamic HTML的縮寫，DHTML通過傳統(tǒng)的HTML語言，利用CSS（Cascading Style Sheets，即樣式表），并依靠javaScript使一向靜止不變的頁面得以“動”起來。 Netscape 4.0和IE 4.0/5.0版本支持DHTML，DHTML是一種完全“客戶端”技術(shù)，直接通過WEB頁面實現(xiàn)頁面與用戶之間的交互性。DHTML的優(yōu)秀之處在于增強了Web頁面的功能，在Web頁面直接建立動畫、游戲和應(yīng)用軟件等等，提供了瀏覽站點的全新方式，與Java、Flash等技術(shù)不同的是，用DHTML編制的頁面不需要插件的支持就能完整的實現(xiàn)。

【設(shè)計過程】

下面筆者以IE5.0為例，說明一個嵌入式WEB視頻點播系統(tǒng)的實現(xiàn)方法，其中用到了部分PHP和Javascript技術(shù)，有疑惑的讀者請參考相關(guān)資料。

一、插入RealPlayer ActiveX對象（如果要進行測試，需要先安裝RealPlayer播放器）

假定以下代碼包含在video.php文檔中（該文件將在主頁面中通過<iframe>進行鏈接）。

<object width="320" height="250" classid="clsid:CFCDAA03-8BE4-11cf-B84B-0020AFBBCCFA">

<param name="CONTROLS" value="ImageWindow">

<param name="CONSOLE" value="Video">

<param name="CENTER" value="TRUE">

<param name="MAINTAINSPECT" value="TRUE">

</object> //定義播放界面

<object width="320" height="30" classid="clsid:CFCDAA03-8BE4-11cf-B84B-0020AFBBCCFA">

<param name="CONTROLS" value="StatusBar">

<param name="CONSOLE" value="Video">

</object> //定義狀態(tài)欄

<object width="320" height="30" classid="clsid:CFCDAA03-8BE4-11cf-B84B-0020AFBBCCFA">

    <param name="CONTROLS" value="ControlPanel">

    <param name="CONSOLE" value="Video">

    <param name="SRC" value="<?php echo getsrc(); ?>">

    <param name="AUTOSTART" value="TRUE">

    <param name="PREFETCH" value="0">

    <param name="LOOP" value="0">

    <param name="NUMLOOP" value="0">

</object> //定義控制面板

其中，CONTROLS參數(shù)用來指定播放器的控件外觀，可以用多個控件進行組合，并通過CONSOLE參數(shù)進行關(guān)聯(lián)。

有關(guān)param參數(shù)，讀者可以參閱RealPlayer官方網(wǎng)站http://service.real.com/help/library/guides/production/htmfiles/control.htm。

這里的SRC參數(shù)尤為重要，用來指定視頻流文件的URL地址。這里筆者使用PHP代碼的方法動態(tài)的指定SRC，讀者也可以使用其它如asp，或完全通過 JavaScript 實現(xiàn)。

    二、使用DHTML動態(tài)控制RealPlayer控件的播放

    小技巧：<IFRAME>的妙用。由于為RealPlayer控件指定新的SRC需要刷新頁面，使用<IFRAME>可以把RealPlayer控件嵌入到單獨的頁面中，這樣，動態(tài)刷新就是在<IFRAME>內(nèi)進行，不會影響用戶觀看頁面其它內(nèi)容。

    以下代碼包含在主頁面中：

<IFRAME id="iVideo" SRC="video.php" Width=500 Height=345 frameborder=0 SCROLLING="no">

</IFRAME>，其中，video.php文件用力顯示RealPlayer控件。

下面我們加入簡單的JavaScript 代碼用來控制視頻的播放。

<script language="JavaScript">

    function play(filename){

        top.document.all("iVideo").src = "video.php?src="+filename;

    } // iVideo 是剛剛定義的IFRAME 的標識符

</script>

我們可以使用javascript控制RealPlayer插件更復(fù)雜的功能，如提取視頻的長寬、測試用戶的網(wǎng)絡(luò)速率、自定義播放事件等等。關(guān)于RealPlayer ActiveX開發(fā)的具體細節(jié)，請參閱RealPlayer官方網(wǎng)站http://service.real.com/help/library/guides/extend/embed.htm。

我們假設(shè)有一個視頻文件，其URL為http://YourURL/filename.ram，那么我們就可以這樣定義：

<a href="JavaScript:play('http://YourURL/filename.ram')">文件1</a>，如果文件是在本地，URL也可以為相對路徑。

三、檢測用戶是否安裝RealPlayer播放器

在頁面的<head></head>部分加入以下JavaScript代碼，用以檢測用戶是否安裝RealPlayer播放器：

<SCRIPT LANGUAGE=JavaScript>



</Script>

至此，我們已經(jīng)實現(xiàn)了一個基于Web的視頻點播的基本功能。但我們要想把功能做的更完美一些，還需要其它更復(fù)雜的考慮。如流媒體的制作、網(wǎng)頁美工的設(shè)計、網(wǎng)絡(luò)流速的考慮，以及網(wǎng)站視頻文件的有效組織。這些話題已經(jīng)超出了本文的討論范圍，請讀者自行參考相關(guān)資料。

上一篇：在Web界面下如何生成像資源管理器一樣的樹形目錄（版本2.0）

下一篇：在ASP中使用Oracle數(shù)據(jù)庫