FFmpeg基於HLS實現大視頻分片下載播放[視頻直播二]

關於HLS,上篇我們已經講過,它基於http協議,內容包括兩部分:m3u8描述文件,ts媒體文件。
它能夠實現視頻直播,不過直播有點延遲,延遲大小與循環體的大小有關。咱們將要利用它的循環體,來實現大視頻的分片下載播放。
問:怎麼將一個視頻分片獲得m3u8文件?
答:利用ffmpeg工具。
問:那麼什麼是FFmpeg呢?
答:FFmpeg是一套能夠用來記錄、轉換數字音頻、視頻,而且將其轉化爲流的開源程序。
它提供了錄製、轉換及流化音視頻的完整解決方案。包含很是先進的音視頻編碼解碼庫libavcodec。
FFmpeg是在Linux平臺下開發,但它能夠在其餘操做系統環境中編譯運行。FF表明 fast forward 。
問:FFmpeg的組成?
答:主要包含三部分:
第一部分是四個做用不一樣的工具軟件,分別是:
ffmpeg.exe,ffplay.exe,ffserver.exe和ffprobe.exe。
•ffmpeg.exe:音視頻轉碼、轉換器
•ffplay.exe:簡單的音視頻播放器
•ffserver.exe:流媒體服務器
•ffprobe.exe:簡單的多媒體碼流分析器
第二部分是能夠供開發者使用的SDK,爲各個不一樣平臺編譯完成的庫。
若是說上面的四個工具軟件都是完整成品形式的玩具,那麼這些庫就至關於樂高積木同樣,咱們能夠根據本身的需求使用這些庫開發本身的應用程序。這些庫有:
•libavcodec:包含音視頻編碼器和解碼器
•libavutil:包含多媒體應用經常使用的簡化編程的工具,如隨機數生成器、數據結構、數學函數等功能
•libavformat:包含多種多媒體容器格式的封裝、解封裝工具
•libavfilter:包含多媒體處理經常使用的濾鏡功能
•libavdevice:用於音視頻數據採集和渲染等功能的設備相關
•libswscale:用於圖像縮放和色彩空間和像素格式轉換功能
•libswresample:用於音頻重採樣和格式轉換等功能
第三部分是整個工程的源代碼,不管是編譯出來的可執行程序仍是SDK,都是由這些源代碼編譯出來的。
FFmpeg的源代碼由C語言實現,主要在Linux平臺上進行開發。FFmpeg不是一個孤立的工程,它還存在多個依賴的第三方工程來加強它自身的功能。在當前這一系列的博文/視頻中,咱們暫時不會涉及太多源代碼相關的內容,主要以FFmpeg的工具和SDK的調用爲主。到下一系列咱們將專門研究如何編譯源代碼並根據源代碼來進行二次開發。javascript

下載與安裝FFmpeg
《FFmpeg官網》html

FFmpeg基於HLS實現大視頻分片下載播放[視頻直播二]

配置環境變量java

FFmpeg基於HLS實現大視頻分片下載播放[視頻直播二]

FFmpeg基於HLS實現大視頻分片下載播放[視頻直播二]

【使用】
在視頻所在的文件夾,輸入如下命令(我這裏有一個123.mp4的電影):編程

ffmpeg -i 80s.mp4 -c:v libx264 -c:a aac -strict -2 -f hls -hls_list_size 0 -hls_time 60 output/output.m3u8

FFmpeg基於HLS實現大視頻分片下載播放[視頻直播二]

FFmpeg基於HLS實現大視頻分片下載播放[視頻直播二]

初始視頻地址123.mp4
hls_time 10 表示切片視頻的時長,默認爲2
hls_list_size 表示 m3u8 文件記錄切片的數量,默認爲5.即只記錄最後5條切片,設置爲0表示記錄全部切片瀏覽器

漫長的等待.......服務器

FFmpeg基於HLS實現大視頻分片下載播放[視頻直播二]

問:瀏覽器怎麼播放m3u8格式的視頻?
答:使用safari瀏覽器打開就能夠播放數據結構

<!DOCTYPE hmtl>
    <html>
    <head>
    <title>the5fire m3u8 test</title>
    </head>
    <body>
    <video controls autoplay >
            <source src="http://127.0.0.1:8080/frozen/video/finish/output.m3u8">
    </video>
    </body>

可是,在其餘瀏覽器上卻:ide

FFmpeg基於HLS實現大視頻分片下載播放[視頻直播二]

所以咱們得調成使用flash播放,這裏使用的是swfobject.js。《StrobeMediaPlayback.swf》
【拓展:swfobject.js】
首先,咱們要爲SWF資源預留一個HTML結點。這個HTML結點內的全部內容都會在客戶端被Flash資源替換,當客戶端沒有安裝Flash播放器的時候,這些內容會顯示出來。這一特點在SEO以及對用戶體驗方面很是有必 要。函數

<!DOCTYPE hmtl>
    <html>

        <head>
            <meta charset="UTF-8">
            <title>m3u8播放器</title>
            <script type="text/javascript" src="swfobject/src/swfobject.js" ></script>
        </head>

        <body>
            <div id="player">
            </div>
            <script>
                var flashvars = {
                    // M3U8 url, or any other url which compatible with SMP player (flv, mp4, f4m) 
                    // escaped it for urls with ampersands         
                    src: escape("http://127.0.0.1:8080/frozen/video/finish/output.m3u8"),
                    // url to OSMF HLS Plugin         
                    //plugin_m3u8: "http://www.the5fire.com/static/demos/swf/HLSProviderOSMF.swf",
                    plugin_m3u8:"http://127.0.0.1:8080/frozen/video/finish/HLSProviderOSMF.swf"

                };
                var params = {
                    // self-explained parameters         
                    allowFullScreen: true,
                    allowScriptAccess: "always",
                    bgcolor: "#000000"
                };
                var attrs = {
                    name: "player"
                };

                swfobject.embedSWF(
                    // url to SMP player         
                    //"http://www.the5fire.com/static/demos/swf/StrobeMediaPlayback.swf",
                    "http://127.0.0.1:8080/frozen/video/finish/StrobeMediaPlayback.swf",
                    // div id where player will be place         
                    "player",
                    // width, height         
                    "800","485",
                    // minimum flash player version required         
                    "10.2",
                    // other parameters         
                    null, flashvars, params, attrs
                );
            </script>
        </body>

    </html>

大功告成!!!!工具

FFmpeg基於HLS實現大視頻分片下載播放[視頻直播二]

相關文章
相關標籤/搜索