黃聰:使用七牛上傳視頻調用視頻播放器的推薦方案

視頻應用一般要求播放器具有如下的基本特性:html

多客戶端支持。包括:PC端(Web播放)和移動端(iOS,Android等)。具有多平臺支持的播放器有助於簡化開發,規避平臺之間的差別。 
經常使用的音視頻編碼格式支持。經常使用編碼格式主要是:視頻H264;音頻MP3和AAC。這些音視頻格式使用普遍,兼容性較好。 
經常使用的容器格式支持。經常使用容器格式包括:flv、mp四、HLS(m3u8/mpeg-ts),mp3,aac。知足這些格式,即可以覆蓋大多數的應用場景。 
播放數據統計。播放統計數據主要用於用戶觀看統計、計費、基礎服務的狀態分析、用戶行爲分析等等。 
廣告。廣告是視頻應用重要的變現手段。 
外觀定製。外觀定製幫助音視頻應用美化界面,提升用戶體驗。 
播放器的選擇html5

可供選擇的播放器不少,但可以很好地支持上述功能的播放器爲數很少,經常使用的有:git

ckplayer: http://www.ckplayer.com 
GrindPlayer: http://osmfhls.kutu.ru/docs/grind/github

下表羅列了這幾種播放器的功能特性:

  seweise palyer JW Player free+HLSProvider ckplayer GrindPlayer
主要格式 mp四、flv、m3u8 mp四、flv、m3u8 mp四、flv mp四、flv、m3u8
播放技術 flash&html5 flash&html5 flash&html5 flash&html5
外觀設置 支持 支持 支持 不支持
播放列表 支持 支持 支持 支持
廣告 支持 支持 支持 支持
統計信息 支持 支持 支持 支持
字幕 支持 支持 不支持 支持
DVR 支持 支持 不支持 支持
直播 rtmp、hls rtmp、hls rtmp hls
HLS加密 支持 不支持(需premium和Enterprise版) 不支持 128bit
收費 免費/開源 免費/開源(不能用於商業用途) 免費 開源

能夠看出,JW Player的功能最爲完整。其免費版存在功能限制,好比沒有HLS支持,但有一些開源的插件能夠補充這些功能。JW Player免費版+插件的形式主要問題在於免費版不能用於商業用途。ckplayer功能不少,但缺乏HLS在Web上的播放支持,因此使用上存在障礙。GrindPlayer功能比較全面些,一般的用況下,足賦使用。瀏覽器

所以,若是能夠承擔一些費用的話,Premium版的JW Player是最好的選擇。若是音視頻應用但願使用免費的播放器,而且沒有外觀設置之類的需求,那麼可使用GrindPlayer。若是用戶不須要HLS的支持,那麼可使用ckplayer。若是GrindPlayer和ckplayer都不能知足要求,同時又要免費,那麼能夠免費版JW Player+插件。但須要說明的是,這種形式可能存在法律風險,由於免費版JW Player不能用於商業用途。七牛雲存儲

格式的選擇

音視頻編碼和容器格式的選擇須要兼顧不一樣播放平臺和播放器,同時還須要最少的資源消耗量和開發量。緩存

咱們首先建議使用通用性較好的格式。頻編碼格式支持最多的應是H264,大部分的瀏覽器、移動端和播放器都支持這種編碼格式。音頻格式常見的主要是MP3和AAC,二者得到大多數的平臺支持。所以,音視頻應用應當儘量以這些編碼生成視頻文件,以便免去進一步編碼轉換的麻煩。若是應用沒法控制源音視頻的編碼,那麼能夠在音視頻上傳後使用七牛雲存儲的音視頻轉碼功能,生成播放所需的音視頻。網絡

容器格式相對複雜一些。不一樣播放平臺的支持各有不一樣。可是,若是選擇了合適的播放器,那麼這方面的選擇能夠簡單不少。通常而言,flv格式主要用於flash播放器,mp4在html5上支持較好。而移動端(iOS、Android)上,主要支持MP4和HLS。因爲iOS端排斥flash,從而沒法播放flv格式。若是咱們但願在全部平臺上使用統一的一種格式,那麼只有MP4。因此,通常狀況下,咱們建議使用MP4做爲視頻播放的主要格式。ide

MP4的不足之處在於對拖動播放(seek)支持很差。拖動播放是用戶常見的一種播放行爲,當用戶須要跳過某些內容,或者音視頻應用支持進度條打點和縮略圖功能的時候,拖動播放有着很是重要的做用。正常狀況下,播放器須要將MP4音視頻文件緩存到拖放點,才能開始正式播放。但這會致使用戶長時間等待,而且產生大量的廢流量。有一些工具能夠幫助服務端提供支持「?start=…」這樣的參數,但在使用上存在諸多限制和問題。更有效的方式是將長視頻切分紅片斷(一般5-10分鐘一片),由一個播放列表串接起來。播放器在拖動播放時,只下載所涉及的片斷,提升響應,減小廢流量。工具

可是這種長視頻切片的功能須要播放器的額外支持,現有播放器對此的支持很少。捷徑是使用HLS。HLS儘管一般用於直播,但也能夠用於點播。其作法是將長視頻切片,而後用m3u8文件創建索引,由播放器解析而且自動加載和播放。

HLS的問題在於PC端的播放器支持不理想,flash播放器和桌面瀏覽器的html5都不原生支持HLS。所以,咱們在選擇播放器的時候將HLS做爲重要的一種能力。在上述列出的四種播放器中,大部分都支持HLS協議。所以,咱們建議用戶選擇其中支持Web端HLS的播放器,而且使用七牛雲存儲的視頻切片功能,將其轉換爲HLS協議,簡化應用的開發,提升用戶體驗。關於HLS播放相關支持,請參考在七牛雲存儲上播放HLS

此外,對於有些應用,但願對於不一樣的用戶端採用不一樣的音視頻分辨率和碼率,以適應不一樣的使用環境。好比,移動端採用較低的碼率和音視頻質量,而PC端採用較高的碼率和質量。更進一步,能夠容許用戶根據各自不一樣的網絡環境自動或者手動地選擇音視頻質量。這須要音視頻播放的多碼率的支持。HLS自己支持多碼率音視頻流,能夠很方便地實現這種功能。關於HLS多碼率支持,請參考如何利用七牛雲存儲實現HLS的多碼率播放

案例

假設有一個視頻文件: sintel_trailer.mp4,以HLS播放。須要作三件事情:

將文件上傳至七牛雲存儲。具體上傳方法參考上傳操做。 
使用avthumb/m3u8功能將其轉換成HLS媒體文件。這個轉換能夠在上傳時使用數據預處理功能執行轉換;或者在上傳完成後,對其進行持久化FOP。可是,不管哪一種方式,都須要使用saveas功能轉碼結果保存爲指定的名稱(須要.m3u8文件名後綴)。 
將轉碼後的結果構形成下載URL: http://ztest.qiniudn.com/sintel.m3u8 ,而後放入播放器,或者播放頁面的參數中。

最主要給你們推薦一款免費播放插件

插件地址:https://github.com/jackzhang1204/sewise-player 
demao :http://jackzhang1204.github.io/sewise/sewise_player/demos/index.html

下面的播放頁面演示了幾種播放器播放樣例視頻:

HLS:

seweizhi:http://seweizhi.qiniudn.com/demao.html 
GrindPlayer:http://www.flashls.org/latest/examples/osmf/GrindPlayer.html 
seweizhi:http://jackzhang1204.github.io/sewise/sewise_player/demos/index.html

MP4: 
seweizhi:https://github.com/jackzhang1204/sewise-player

FLV: 
seweizhi:http://jackzhang1204.github.io/sewise/sewise_player/demos/index.html 

相關文章
相關標籤/搜索