Home 主頁 Service 服務計畫 Android App 手機程式 Expertise 專業領域 Blog 博客 Download 下載 FAQ 網頁製作常見問題 Support 支援 Links 友情連結 Contact Us 聯絡我們

Flash Video streaming視頻串流實作

發佈: 04-26-2011

分類: 網頁設計

Flash video是最廣為接受的網上視頻格式。現在很多網站都支持flash video streaming,這不單是指你可以在browser上播放flash video,而且可以指定播放位置,即時跳到你想看的地方(包括沒有下載的資料流)。 本文將介紹如何簡單地在網頁應用層面(application layer)做flash video streaming。

我們既打算在網頁上播放視頻,當然要有一個flash video player(就是用戶在網頁上看到flash視頻的player)。現今流行的免費flash video player有JW PlayerFlowplayer。 筆者比較喜歡JW Player,以下就用JW Player為例。JW Player還支持html5和iphone / ipad / android等移動裝置上播放影片,應該可以支持基本的需要。

  1. 準備播放的視頻。
  2. 決定儲存和存取視頻的方式。
  3. 轉換視頻格式以支援streaming。
  4. 用flash movie player播放視頻。

準備播放的視頻

Flash video player一般都支持.mp4,*.flv等視頻格式。如果你的視頻是wmv或mpg,你要先把它們轉換成可以播放的格式。FFMPEG是個強大免費的轉換程式,你可以用它來轉換視頻格式。 以下是個基本的轉換command:

ffmpeg -i test.wmv test.flv

以上過程要花費一點時間,如要線上轉換則可能要編寫一個程序,以queue的方式續一轉換。如果你有在youtube上載視頻,也許你也會留意到上傳後也要過一些時間,才可以顯然出來,原因就是轉換時間,同一時間大量轉換現在是不可能的。

決定儲存和存取視頻的方式

最簡單的方式當然是儲存在自己的web server。當用戶播放視頻時,資料都是從你的web server中下載。 這裡又有兩個情況:

漸進式下載 Progressive Download

(1)你的儲存格式是mp4或其他不可以直接做streaming的格式,這樣你只可以播放已下載的內容,而且是從視頻的開頭開始下載(先下載第一秒第二秒...你不可以一下只就跳到第10秒),視頻文件則放在web server上。這當然不夠好,以下我們還有更好的選擇。

HTTP偽串流 HTTP Pseudo-Streaming

(2)你的儲存格式是flv,它便可以支持pseudo-streaming(用戶可以一下只就跳到想看的地方)。這方法也文件也是放在web server就可以了。為什麼說是偽串流?因為它看起來雖然好像在做streaming,不過flv其實是先下載到電腦再播放,只不過你下載時告訴web server在那裡開始下載,其實這怎麼說也只能是點播。你很可能會使用這方式,因為它成本很低,而且可以做到streaming的效果!

RTMP Streaming

較高級的應用可以考慮使用Real Time Messaging Protocol (RTMP)。RTMP是基於TCP的多媒體傳輸協議,這類方案一般都不是免費,但卻可做到真正的streaming。由於RTMP是依靠TCP的連接,然後發放數據包,你不用在browser中下載flv文件,便可播放視頻。播放完成後,視頻文件不會留在browser中,也減小了很多版權的問題。你可以把資料存放在flash media server,這比較適合大型的應用,這不是本文的重點。以下的例子,都是免費的HTTP Pseudo-Streaming。

用flash movie player播放視頻

下載JW Player

如果你是商業用途,就要考慮購買Pro的licenses。(JW Player是個Open source的Player)下載完成後,你會找到player.swf,jwplayer.js等文件。 也許你會留意到有一個preview.jpg,其實也可以利用早前介紹的FFMPEG做出來,這裡就不詳細說明了。把readme.html打開,你會看到這個例子:

 

 

 
 

(註:以上是舊版的例子,由於現在readme.html已更新成以javascript加入player,也許這會更容易使用)
jwplayer("mediaplayer").setup({
  flashplayer: "player.swf",
  file: "video.mp4",
  image: "preview.jpg"
});

Readme中的例子是用.mp4的,按上文我們所說它是漸進式下載,沒有做到HTTP偽串流。文件小的話沒什麼問題(因為很快便下載完成,也可以跳到任何時間,用戶很難發覺跳不到沒下載好的地方),如果播放時間長,還是先轉成flv做偽串流吧!然而,它比這例要難一點,有興趣可參考這文件

這樣就完成了!當然這是最基本的例子,很多細節也沒提到,JW Player還支持加入廣告。最後,筆者還是要勸說一句,youtube本身就是個很優秀的方案,而且支持高清播放,也有流量分析資料,還是先考慮使用youtube吧!

訪客: Copyright ©2011 KF Software House 版權所有 | 網站地圖