通用視頻網(wǎng)站管理系統(tǒng)的研究與開發(fā)

朱如意　李連民

摘要：隨著人們的生活節(jié)奏的日益加快，互聯(lián)網(wǎng)時代的快速發(fā)展，人們會更希望利用很短的時間就可以通過小短片學處理生活中技巧等等。通過網(wǎng)站來存儲、播放用戶的視頻（一般網(wǎng)站通有的功能）。該文就是基于HTML5的video的視頻播放網(wǎng)站的一些關(guān)鍵問題進行了闡述和說明。

this.addClass（'my-example'）；

}）；

3.3 獲取或設(shè)置HTML5視頻播放器中視頻的相關(guān)參數(shù)

當下web應(yīng)用程序變得很普通加載一次完成的頁面就要能夠管理整個視頻播放器的整個生存周期，同時可以改變播放器的音量（volume（）獲?。?、讓播放器全屏顯示（isFullscreen（））、退出出全屏會話（exitFullscreen（））、當前的播放的位置（currentTime（））、正在播放視頻的總時間（duration（））以及緩沖的時間百分比（bufferedPercent（））。

4 基于HTML5Video的視頻播放器的功能的實現(xiàn)

4.1 視頻播放器的外觀

我們可以看到不同的視頻網(wǎng)站的播放器的外觀都不一樣，我們創(chuàng)建的視頻播放器沒有任何的修飾，只有有一些簡單的樣式，這樣看起來有時會不舒服，我們?yōu)榱诉_到更好的用戶體驗，當我們加入video-js.min.css這個樣式的時候視頻播放器會默認的樣式，當我們使用框架的時候可能會影響視頻播放器的效果，我們要抑制這種情況的發(fā)生我們需要使用window.VIDEOJS_NO_DYNAMIC_STYLE = true在video.js之前，可以通過設(shè)置它們抑制它們。創(chuàng)建視頻播放器的樣式可以覆蓋默認提供的樣式，通過設(shè)置這樣的樣式player.addClass（'vjs-matrix'）；

4.2 視頻播放器資源文件的編碼

由于HTML5的video標簽支持的視頻格式很少，總共就支持這三種格式Ogg、MPEG4、WebM。 MP4 = MPEG 4文件使用 H264 視頻編解碼器和AAC音頻編解碼器WebM = WebM 文件使用 VP8 視頻編解碼器和 Vorbis 音頻編解碼器Ogg = Ogg 文件使用 Theora 視頻編解碼器和 Vorbis音頻編解碼器。我們需要將上傳的視頻統(tǒng)統(tǒng)轉(zhuǎn)換為MPEG4格式。

4.3 通過上傳視頻來動態(tài)的獲取圖片

由于我們上傳的視頻往往不需要用戶自己來截取一張圖片來上傳，所以我們就需要自己服務(wù)器自己獲取到上傳的視頻的圖片我們?nèi)匀煌ㄟ^FFPMPEG.exe的插件來獲取。

5 結(jié)束語

現(xiàn)在本地的多媒體已經(jīng)看起來十分炫酷了，當然也不是足夠的成熟，畢竟使用瀏覽器作為媒體播放器也不過兩年時間。與此相對應(yīng)的桌面媒體播放器程序已經(jīng)存在了15年，在這么多年的錘煉中不斷完善。很多人注意到了，大多數(shù)瀏覽器在播放音頻的時候有少許的延遲。許多游戲開發(fā)者經(jīng)常說，F(xiàn)LASH技術(shù)殘留下來就是為他們提供聲音的，正如許多瀏覽器可以需要兩秒鐘來加載HTML5音頻文件。隨著網(wǎng)絡(luò)的發(fā)展，web的內(nèi)容越來越多的是用音視頻的形式來體現(xiàn)了，考慮一下有些用戶無法聽到音軌，或者其母語并不是英語的情況，抑或用戶希望用他們自己的語言來閱讀字幕和內(nèi)容的時候。這時候我們的HTML5就可以很好的解決這樣的問題，所以說我們選擇使用HTML5的video是一個明確的選擇。

參考文獻：

[1] 孫鑫， 付永杰. HTML5、CSS和JavaScript開發(fā)[M]. 北京： 電子工業(yè)出版社，2012.

[2] 陸凌牛. HTML5與CSS3權(quán)威指南[M]. 北京： 機械工業(yè)出版社，2013.

[3] 高少琛. 基于HTML5的內(nèi)容發(fā)布管理系統(tǒng)的研究與實現(xiàn)[J]. 軟件產(chǎn)業(yè)與工程，2016（2）： 43-46.

[4] 黃雄. 基于HTML5的視頻傳輸技術(shù)研究[J]. 廣東技術(shù)師范學院學報， 2014， 35（11）： 20-25.