整合營銷服務(wù)商

          電腦端+手機(jī)端+微信端=數(shù)據(jù)同步管理

          免費(fèi)咨詢熱線:

          HTML5 Video(視頻)

          多站點(diǎn)都會(huì)使用到視頻. HTML5 提供了展示視頻的標(biāo)準(zhǔn)。

          檢測您的瀏覽器是否支持 HTML5 視頻:

          檢測

          Web站點(diǎn)上的視頻

          直到現(xiàn)在,仍然不存在一項(xiàng)旨在網(wǎng)頁上顯示視頻的標(biāo)準(zhǔn)。

          今天,大多數(shù)視頻是通過插件(比如 Flash)來顯示的。然而,并非所有瀏覽器都擁有同樣的插件。

          HTML5 規(guī)定了一種通過 video 元素來包含視頻的標(biāo)準(zhǔn)方法。

          瀏覽器支持

          Internet Explorer 9+, Firefox, Opera, Chrome, 和 Safari 支持 <video> 元素.

          注意: Internet Explorer 8 或者更早的IE版本不支持 <video> 元素。

          HTML5 (視頻)- 如何工作

          如需在 HTML5 中顯示視頻,您所有需要的是:

          實(shí)例

          <video width="320" height="240" controls>

          <source src="movie.mp4" type="video/mp4">

          <source src="movie.ogg" type="video/ogg">

          您的瀏覽器不支持Video標(biāo)簽。

          </video>

          <video> 元素提供了 播放、暫停和音量控件來控制視頻。

          同時(shí)<video> 元素元素也提供了 width 和 height 屬性控制視頻的尺寸.如果設(shè)置的高度和寬度,所需的視頻空間會(huì)在頁面加載時(shí)保留。。如果沒有設(shè)置這些屬性,瀏覽器不知道大小的視頻,瀏覽器就不能再加載時(shí)保留特定的空間,頁面就會(huì)根據(jù)原始視頻的大小而改變。

          <video> 與</video> 標(biāo)簽之間插入的內(nèi)容是提供給不支持 video 元素的瀏覽器顯示的。

          <video> 元素支持多個(gè) <source> 元素. <source> 元素可以鏈接不同的視頻文件。瀏覽器將使用第一個(gè)可識(shí)別的格式:

          視頻格式與瀏覽器的支持

          當(dāng)前, <video> 元素支持三種視頻格式: MP4, WebM, 和 Ogg:

          瀏覽器MP4WebMOgg
          Internet ExplorerYESNONO
          ChromeYESYESYES
          FirefoxYESYESYES
          SafariYESNONO
          OperaYES (從 Opera 25 起)YESYES
          • MP4 = 帶有 H.264 視頻編碼和 AAC 音頻編碼的 MPEG 4 文件

          • WebM = 帶有 VP8 視頻編碼和 Vorbis 音頻編碼的 WebM 文件

          • Ogg = 帶有 Theora 視頻編碼和 Vorbis 音頻編碼的 Ogg 文件

          視頻格式

          格式MIME-type
          MP4video/mp4
          WebMvideo/webm
          Oggvideo/ogg

          HTML5 <video> - 使用 DOM 進(jìn)行控制

          HTML5 <video> 和 <audio> 元素同樣擁有方法、屬性和事件。

          <video> 和 <audio>元素的方法、屬性和事件可以使用JavaScript進(jìn)行控制.

          其中的方法有用于播放、暫停以及加載等。其中的屬性(比如時(shí)長、音量等)可以被讀取或設(shè)置。其中的 DOM 事件能夠通知您,比方說,<video> 元素開始播放、已暫停,已停止,等等。

          例中簡單的方法,向我們演示了如何使用 <video> 元素,讀取并設(shè)置屬性,以及如何調(diào)用方法。

          實(shí)例 1

          為視頻創(chuàng)建簡單的播放/暫停以及調(diào)整尺寸控件:

          播放/暫停 放大 縮小 普通

          上面的例子調(diào)用了兩個(gè)方法:play() 和 pause()。它同時(shí)使用了兩個(gè)屬性:paused 和 width。

          HTML5 Video 標(biāo)簽

          標(biāo)簽描述
          <video>定義一個(gè)視頻
          <source>定義多種媒體資源,比如 <video> 和<audio>
          <track>定義在媒體播放器文本軌跡

          照相機(jī)、留聲機(jī)誕生,解決了人們記錄影像、聲音的需求以來,人們就不斷地追求著在有限的條件下盡可能地提高這些記錄的品質(zhì),而從模擬時(shí)代過渡到數(shù)字時(shí)代以后,這方面的追求有一部分變成了在盡可能小的空間中提供盡可能好的內(nèi)容質(zhì)量,這就催生出了一系列不斷演進(jìn)著的媒體壓縮技術(shù)。

          不過這期課堂的主題尚未來到媒體編碼的歷史,在講音視頻圖像的壓縮算法進(jìn)化之路前,我們先來了解一下這些媒體內(nèi)容的載體——容器格式的進(jìn)化歷程。

          首先需要區(qū)分清楚的,就是容器格式與媒體編碼格式。

          何為容器(Container)

          對(duì)于數(shù)字媒體數(shù)據(jù)來說,容器就是一個(gè)可以將多媒體數(shù)據(jù)混在一起存放的東西,就像是一個(gè)包裝箱,它可以對(duì)音視頻數(shù)據(jù)進(jìn)行打包裝箱,將原來的兩塊數(shù)據(jù)整合到一起,也可以單單只存放一種類型的媒體數(shù)據(jù)。它就像電影膠片一樣,中央是一幀一幀的圖像,而兩旁則印有對(duì)應(yīng)的音軌。



          舉個(gè)簡單的例子,常見的MP4就是一種媒體容器格式而不是編碼格式,它里面的視頻編碼可以是現(xiàn)在最常見的AVC/H.264,也可以是它的前任H.263或者下一任——HEVC,音頻編碼可以是常見的AAC也可以是AC-3。

          另一個(gè)生僻點(diǎn)的例子:最常見的圖片格式——JPEG,它其實(shí)只是一種壓縮方式,而它的存放方式其實(shí)叫做JFIF(JPEG File Interchange Format),雖然在JPEG標(biāo)準(zhǔn)中定義了一種名為JIF(JPEG Interchange Format)的容器格式,但是因?yàn)槠淙狈δ承╆P(guān)鍵要素,造成了使用的不便而被后來第三方開發(fā)出來的JFIF容器給取代了,今天我們能夠看到的JPEG文件幾乎都是裝在JFIF容器中的。

          雖然今天我們能夠直接拿到的MP4文件里面裝的幾乎都是AVC+AAC的組合,但還是不能混淆了兩者的概念,容器就是個(gè)容器,它沒得靈魂。

          AVI: 老而彌堅(jiān)

          AVI可能是和筆者年齡相仿的朋友最早接觸的一個(gè)格式。確實(shí),它推出的時(shí)間相對(duì)較早,也是許久以前最為常見的一種容器格式。它全稱叫做音頻視頻交錯(cuò)( Audio Video Interleave),顧名思義,它就是簡單地將視頻與音頻交錯(cuò)在一起,幾幀視頻之后就是對(duì)應(yīng)的音頻段,這樣重復(fù),直到結(jié)束。



          AVI文件的結(jié)構(gòu)示意圖

          它由三部分組成,頭部、主體以及位于文件尾部的索引。頭部中含有文件的元數(shù)據(jù)(metadata),比如視頻的分辨率、碼率總幀數(shù)等信息。主體部分是媒體數(shù)據(jù)的存放區(qū),它使用了塊(chunk)的概念,將原本的視頻流和音頻流分成塊狀進(jìn)行交錯(cuò)放置,就是上面講的一段視頻一段音頻交錯(cuò)放置,而尾部則是用來放置索引,它用來記錄每個(gè)數(shù)據(jù)塊在文件中的偏移位置。



          紅框標(biāo)注為對(duì)軌道的標(biāo)識(shí)

          講到AVI,還可以聯(lián)動(dòng)一下WAV和蘋果那邊的AIFF,這些容器格式其實(shí)是同源的,來自于EA(對(duì),就是現(xiàn)在那個(gè)做游戲的EA)為了讓不同公司開發(fā)出來的軟件之間進(jìn)行數(shù)據(jù)交換而在1985年開發(fā)出來的IFF(Interchange File Format)格式。蘋果在IFF的基礎(chǔ)上開發(fā)出了AIFF,而微軟與IBM將IFF格式使用的大端序改成小端序就成了RIFF(Resource Interchange File Format),也就是AVI、WAV這兩個(gè)容器的基本原型。




          AVI雖然老,但是因?yàn)樗詭瑸閱挝话褦?shù)據(jù)切成塊來存放的特性,使得它幾乎支持市面上幾乎所有的音視頻編碼。而它的缺點(diǎn)也有很多,首先因?yàn)樗饕谖募膊康年P(guān)系,所以它并不適合用來流傳輸;另外在容器中也沒有時(shí)間戳,只能通過幀數(shù)和幀率信息來進(jìn)行計(jì)算,在索引里面并沒有寫明時(shí)間戳—媒體位置的數(shù)據(jù),所以要在播放AVI時(shí)進(jìn)行快速跳轉(zhuǎn)還需要額外的技術(shù)手段;而媒體數(shù)據(jù)分塊存放也使得它對(duì)很多使用運(yùn)動(dòng)預(yù)測特性的視頻編碼的支持并不是太好,因?yàn)檫@些幀,比如P幀和B幀,都是通過I幀進(jìn)行計(jì)算得到的,這就需要訪問當(dāng)前幀以外的數(shù)據(jù)了。

          MPEG-PS:VCD、DVD的功臣

          用電腦播放過VCD的朋友一定還記得會(huì)在目錄里尋找那個(gè)最大的.DAT文件來播放,而DVD則是找那個(gè)最大的.VOB。其實(shí)這兩個(gè)格式都是MPEG-PS容器規(guī)范的一種,此PS非彼Photoshop,而是指Program Stream,是MPEG組織在1993年發(fā)布的一個(gè)容器標(biāo)準(zhǔn),并且隨后寫入ISO/IEC國際標(biāo)準(zhǔn),除了以上兩種后綴名之外,還有.mpg也用的是這個(gè)標(biāo)準(zhǔn)。

          MPEG-PS標(biāo)準(zhǔn)中引入了包的概念,整個(gè)文件由一個(gè)個(gè)包組成,每個(gè)包的大小并不相等,包里面含有這個(gè)包的時(shí)間碼以及對(duì)應(yīng)的音視頻數(shù)據(jù)。

          MPEG-PS已經(jīng)隨著時(shí)代的進(jìn)步被廢棄了,它只能存放MPEG-1、MPEG-2、MPEG-4這些出自同門的視頻編碼,限制性較大。但因?yàn)閂CD和DVD的廣泛流行,實(shí)際上它還是被用的相當(dāng)多的。

          MPEG-TS:專為流傳輸而生

          MPEG組織不僅僅為音視頻文件的存儲(chǔ)制定了容器標(biāo)準(zhǔn),還早早地順應(yīng)時(shí)代潮流,為它們的傳輸準(zhǔn)備了相應(yīng)的容器。我們的數(shù)字電視和IPTV用的就是MPEG組織在1995年制定的Transport Stream,也就是TS容器,當(dāng)然它也并不限于這兩個(gè)場景,在現(xiàn)在的低延時(shí)直播系統(tǒng)中,MPEG-TS仍然占據(jù)了絕對(duì)主流的地位,原因就是它的整個(gè)結(jié)構(gòu)就是為了流傳輸而設(shè)計(jì)的。



          從IP層到TS包內(nèi)部的結(jié)構(gòu)

          一個(gè)TS文件中可以容納多個(gè)TS流,不同的流上面可以帶有不同的音視頻數(shù)據(jù),這樣通過接收一個(gè)TS文件,用戶方面可以自由地在這個(gè)TS文件中的多個(gè)子TS流之間進(jìn)行切換,非常適合用于傳輸電視節(jié)目。而它同時(shí)針對(duì)復(fù)雜的傳輸環(huán)境進(jìn)行了針對(duì)性的優(yōu)化,TS流的基礎(chǔ)單位是一個(gè)個(gè)大小僅為188字節(jié)的包,每個(gè)包都有自己的獨(dú)立時(shí)基,并且由于采用了固定大小,所以在傳輸過程中即使遭遇丟包也很快就可以恢復(fù)正常播放。

          發(fā)展到今天,TS仍然在網(wǎng)絡(luò)流傳輸時(shí)代中發(fā)揮著自己重要的作用,在蘋果主導(dǎo)的HLS(Http Live Streaming)協(xié)議中使用的就是TS流,它比MPEG-DASH更加通用,因?yàn)楹笳邔?duì)于MP4文件進(jìn)行了一定的修改,在老平臺(tái)上面支持不太好,而HLS使用的TS仍然是規(guī)范中的,可以被大多數(shù)設(shè)備兼容。

          不過也因?yàn)門S分包較多的特性,會(huì)產(chǎn)生一些數(shù)據(jù)冗余,所以在存儲(chǔ)場景中一般不會(huì)使用TS作為容器。

          M2TS:專為高清時(shí)代而生

          M2TS多見于Blu-ray光盤和高清錄像(AVCHD)中,它由MPEG-TS修改而來,加入了對(duì)于高清時(shí)代新的音視頻編解碼支持。



          一張Blu-ray視頻光盤中的M2TS

          并且由于TS文件的特性,每一個(gè)小片上都有自己的獨(dú)立時(shí)間戳,這使得文件中一部分?jǐn)?shù)據(jù)即使遭到破壞也不會(huì)影響到其他部分的正常播放,而且可以從中隨意的進(jìn)行切片操作。

          ASF:先進(jìn)卻早夭

          見過ASF格式視頻的朋友我想應(yīng)該不會(huì)太多,但是見過WMV和WMA這兩個(gè)微軟以前主推的媒體編碼格式的朋友肯定有很多。其實(shí)WMV和WMA就是存放在ASF容器之中的,它全稱高級(jí)系統(tǒng)格式(Advanced Systems Format),微軟原本計(jì)劃是用它來作為AVI容器的后繼者的,它具有諸多先進(jìn)的特性,比如說它可以包含視頻除了規(guī)格以外的元數(shù)據(jù),如導(dǎo)演、電影名這些,它也可以提供數(shù)字版權(quán)管理(DRM),還有非常好的流傳輸支持——僅需要加載文件的最小部分即可開始播放,這點(diǎn)小編感受過一次。




          ASF文件開頭會(huì)用這32個(gè)字節(jié)來標(biāo)識(shí)自己是個(gè)ASF文件

          ASF身上的這些特性在當(dāng)時(shí)還算是比較先進(jìn)的,但不過這于事無補(bǔ),微軟建立它那套封閉媒體格式體系的做法并沒有得到太多廠商和用戶的支持,大家仍然更喜歡用其他更為開放一點(diǎn)的標(biāo)準(zhǔn),比如MP3就是一個(gè)很好的例子。ASF容器也隨著微軟媒體格式的衰亡而漸漸消失了,我們今天已經(jīng)幾乎看不到WMV、WMA這兩個(gè)曾經(jīng)還很常見的格式的影子了。

          RM:昔日王者,如今不見蹤影



          與ASF差不多同時(shí)代流行的就是RM和RMVB了,在那個(gè)AVC尚未開始普及,DivX和XviD應(yīng)用較少的年代中,RMVB在國內(nèi)的各大下載站中都占據(jù)了絕對(duì)主流的地位,很多視頻站也大多使用RM來提供“網(wǎng)絡(luò)視頻點(diǎn)播”的服務(wù)。



          RM容器的內(nèi)部結(jié)構(gòu)

          不過RM容器本身并不出彩,索引仍然位于文件尾部,不過由于數(shù)據(jù)段里面有加入時(shí)間戳,所以在流傳輸時(shí)還是可以應(yīng)付用戶的跳轉(zhuǎn)操作的。因?yàn)檫@個(gè)容器本身與RM編碼息息相關(guān)的原因,它本身也只能容納RM編碼的視頻流,所以在RM編碼沒落之后我們就很少再看到這些昔日王者了,一個(gè)容器格式想要長存,要么在設(shè)計(jì)上有其獨(dú)到之處,要么就是要開放,在眾多平臺(tái)上面提供支持。而RM兩個(gè)理由都不占,效果又比不過新興的AVC,所以它的沒落也是必然了。

          FLV:前高清時(shí)代的寵兒

          還記得十年前的土豆網(wǎng)嗎?彼時(shí)它還被稱為“國內(nèi)的Youtube”,當(dāng)時(shí)視頻網(wǎng)站普遍都還在用Flash寫播放器實(shí)現(xiàn)流視頻播放,而自然而然地,Adobe制定的Flash Video格式就成了這些視頻網(wǎng)站主要使用的容器格式,也就是我們熟知的FLV。



          FLV格式是在Flash Player 6中引入的,當(dāng)時(shí)更多的是被存放在SWF文件的內(nèi)部,不過后來因?yàn)轶w積越來越大而直接獨(dú)立了出來,它的結(jié)構(gòu)相對(duì)而言比較簡單,主要分為兩塊,位于文件頭部的元數(shù)據(jù)信息和后面的音視頻數(shù)據(jù)。不過在數(shù)據(jù)的存放上面,F(xiàn)LV是將數(shù)據(jù)分為多個(gè)標(biāo)簽進(jìn)行存儲(chǔ)的,每個(gè)標(biāo)簽都帶有自己的時(shí)間戳,所以這就保證了流傳輸時(shí)的音畫同步。

          由于FLV結(jié)構(gòu)簡單但是功能足夠用,并且被Flash Player天然支持,所以在當(dāng)時(shí)的視頻網(wǎng)站上面普遍都使用它作為容器,直到今天還有很多網(wǎng)站沒有放棄它,雖然其中的視頻編碼早已升級(jí),它也有衍生出來的F4V作為后繼者,雖然后者的血統(tǒng)已經(jīng)不是Flash家族的了。

          F4V:換了血的繼任者

          小編還記得土豆網(wǎng)在2009、2010年左右在國內(nèi)率先開始使用H.264編碼,當(dāng)時(shí)如果將清晰度切換到“高清”就會(huì)播放這些用H.264編碼的視頻。而用飛速土豆加速會(huì)緩存到一些.f4v擴(kuò)展名的文件,乍一看還以為它就是FLV,但其實(shí)不然,F(xiàn)4V其實(shí)是MP4所在的ISO標(biāo)準(zhǔn)容器家族的,但也是Adobe搞出來的FLV的后繼者。關(guān)于后者的詳情,請往下看。

          MOV:蘋果向業(yè)界作出的貢獻(xiàn)

          MOV格式的正式名字叫QuickTime File Format??吹竭@個(gè)QuickTime第一反應(yīng)肯定是“哦,這是蘋果的東西”。確實(shí),QuickTime File Format是由蘋果在1998年推出的,它引入了原子(atom)的概念,在QTFF格式中,atom是基本的數(shù)據(jù)單元,它可以用來容納實(shí)際的音視頻數(shù)據(jù),也可以放置元數(shù)據(jù)和字幕等文本信息,atom中所容納的數(shù)據(jù)類型和大小在每個(gè)atom的頭部進(jìn)行描述,經(jīng)過一層層的嵌套之后,整個(gè)數(shù)據(jù)文件呈現(xiàn)了一種樹狀的結(jié)構(gòu),并且保留了強(qiáng)大的可擴(kuò)展性。



          MOV和MP4這些ISO標(biāo)準(zhǔn)容器格式的開頭都有一個(gè)ftyp用于標(biāo)記格式

          MOV作為蘋果QuickTime編碼的成員,在目前仍然被蘋果設(shè)備廣泛使用著,并且對(duì)于它的支持非常好。1998年推出QTFF的同時(shí),蘋果將這個(gè)格式交給了ISO組織,后者將它標(biāo)準(zhǔn)化為國際通用容器格式,而基于這個(gè)標(biāo)準(zhǔn)衍生出來的容器,又可以叫做ISO/IEC base media file format,同時(shí)被MPEG組織采納,寫入MPEG-4 Part 12標(biāo)準(zhǔn)中。

          ISO標(biāo)準(zhǔn)容器格式

          ISO標(biāo)準(zhǔn)容器格式是一個(gè)規(guī)范,它代表符合這個(gè)規(guī)范的容器類型,而不是特指某個(gè)格式。它是由蘋果的QuickTime File Format發(fā)展而來的,在MPEG-4 Part 12中被最終確定并被ISO/IEC組織寫入標(biāo)準(zhǔn)。它雖然沒有具體實(shí)現(xiàn),但是它定義了基于時(shí)間碼的多媒體文件的通用結(jié)構(gòu),并由此成為了MP4、3GP等格式的基礎(chǔ)。



          3GP、MP4與ISO標(biāo)準(zhǔn)容器格式的關(guān)系

          MP4:標(biāo)準(zhǔn),泛用

          MP4肯定是現(xiàn)在最通用最流行的媒體容器,甚至可以說沒有之一。但其實(shí)現(xiàn)在的MP4和早期的并不是同一個(gè)標(biāo)準(zhǔn),目前常見的MP4標(biāo)準(zhǔn)是在2003年完整的的MPEG-4 Part 14規(guī)范中制定的,到今天為止也經(jīng)過了多次的修訂。它其實(shí)與MOV之間并沒有太大的區(qū)別,基本上就是把MOV的atom改了個(gè)名字,叫成box,然后加了一點(diǎn)別的佐料。



          MP4的內(nèi)部結(jié)構(gòu)

          蘋果建立iTunes Store賣數(shù)字音樂的時(shí)候選擇了AAC-LC作為他們的音頻編碼格式,而容器格式上面他們并沒有選擇與AAC-LC處于同一時(shí)代(MPEG-2)的ADTS,而是選擇了比AAC-LC大一輩的MPEG-4標(biāo)準(zhǔn)容器,也就是MP4,不過因?yàn)樗缓纛l所以我們看到的擴(kuò)展名就是.m4a,iTunes Store還賣一種只有視頻沒有音頻的MV,它用的也是MP4,擴(kuò)展名為.m4v,本質(zhì)上它們就是同一種東西。

          目前很多視頻網(wǎng)站已經(jīng)從FLV切換到MP4上面了,而且還有一種新的MPEG-DASH格式就是借助于MP4可分割的特性實(shí)現(xiàn)的,它將一整段視頻切成許多段小塊,方便瀏覽器進(jìn)行加載,減少HTTP長連接對(duì)服務(wù)器的壓力。

          這里說一句題外話,當(dāng)年某站剛上HTML5播放器的時(shí)候,因?yàn)樗麄冊瓉淼囊曨l幾乎全部都用的是FLV存儲(chǔ)的,而HTML5標(biāo)準(zhǔn)并不支持它,所以要進(jìn)行一個(gè)容器轉(zhuǎn)換,某站當(dāng)時(shí)一位非常年輕的程序員寫出了一個(gè)在瀏覽器內(nèi)實(shí)時(shí)將FLV文件轉(zhuǎn)成MP4并喂給瀏覽器的媒體播放器的腳本,名為flv.js,這個(gè)腳本可能給某站省下了非常大的格式轉(zhuǎn)換成本。不久之后這位程序員因?yàn)槭懿涣四痴镜牡托蕉x職。這件事曾經(jīng)引起了很多社區(qū)的熱烈討論,因?yàn)榻裉焓浅绦騿T日所以特地寫了這么一段。

          3GP:精簡小巧,手機(jī)最愛

          3GP是MP4的同族兄弟,一樣是基于ISO標(biāo)準(zhǔn)容器格式,用過3GP的兄弟肯定還記得這格式最多出現(xiàn)的地方是哪里——以諾基亞為代表的前智能手機(jī)時(shí)代,手機(jī)錄像出來的文件大多都是3GP格式的。

          3GP這個(gè)容器格式標(biāo)準(zhǔn)其實(shí)不是由以往的MPEG啊這類專注于多媒體編碼的組織搞出來的,而是3GPP,對(duì)沒錯(cuò)就是制定通信行業(yè)標(biāo)準(zhǔn)的那個(gè)組織制定的。它在容器支持的格式上進(jìn)行了精簡,只面向于手機(jī)可以進(jìn)行的編碼,比如MPEG-4 Visual、H.263這些比較老的視頻編碼和AMR、AAC這兩種前智能手機(jī)時(shí)代使用較多的音頻編碼。

          因?yàn)榍爸悄苁謾C(jī)時(shí)代的手機(jī)性能并不強(qiáng)大,一般也不需要支持很多種格式,不用像MP4那么全面,所以3GP最終成為了一種被廣泛支持的格式,不過也因?yàn)樗С值母袷竭^于有限,最終在智能手機(jī)時(shí)代被同門大哥MP4給取代了。

          MPEG-DASH

          面對(duì)時(shí)下流行的流媒體,MPEG組織對(duì)MP4文件進(jìn)行了魔改,由于MP4天生可以進(jìn)行無損切割的特性,DASH方式將原本媒體文件中完整的文件頭的元數(shù)據(jù)信息和片段Box中的信息抽取出來單獨(dú)寫在一個(gè)文件(MPD)中,同時(shí)還包含了片段的URL等信息,播放器可以自適應(yīng)選擇需要的片段進(jìn)行播放,在自適應(yīng)程度上面比HLS更強(qiáng)一些。(其實(shí)MPEG-DASH也可以用TS作為容器,但用MP4更多一些)



          目前MPEG-DASH已經(jīng)成為了一項(xiàng)國際標(biāo)準(zhǔn),人們比較熟悉的應(yīng)用平臺(tái)就是Youtube和Netflix,在這些平臺(tái)上面你會(huì)發(fā)現(xiàn)瀏覽器在不斷地加載一些小的視頻文件,但是視頻的播放是連續(xù)的。

          MKV:強(qiáng)大無需多言,免費(fèi)讓它受愛

          說到MKV,喜歡收藏高清電影的朋友肯定不會(huì)陌生,這種容器格式大概是和高清時(shí)代一起發(fā)展起來的,但其實(shí)它在2002年底就已經(jīng)完成制定了,不過推廣的很緩慢,到了高清時(shí)代和UHD時(shí)代人們才開始發(fā)現(xiàn)這種容器的強(qiáng)大,并用的越來越多,連微軟都在Windows 10的初始版本中加入了對(duì)它的支持。



          MKV的內(nèi)部結(jié)構(gòu)

          MKV全名Matroska,它身上最大的特點(diǎn)就是開放標(biāo)準(zhǔn)、免費(fèi)使用,而且它可能是目前地球上最強(qiáng)大的數(shù)字媒體容器格式,一個(gè)文件中可以放音頻、視頻、字幕、字體還有章節(jié)信息等等等等,前面東西都是不限數(shù)量任你放多少都可以吃得下的,而且它是目前唯一一個(gè)支持封裝ASS字幕的格式。

          值得一提的是,這玩意兒是俄羅斯組織матрёшка搞出來的,其實(shí)本身是用于盜版的,俄羅斯的網(wǎng)絡(luò)情況跟我們挺像的,網(wǎng)絡(luò)上盜版橫行,而MKV也幫助了文件的傳播,目前來看,MKV可能是眾多容器格式里面最好用的,無論是編輯元數(shù)據(jù)還是抽取軌道重新封裝都有GUI工具支持,不過可惜的是眾多視頻編輯剪輯軟件還是沒有提供對(duì)它的支持。

          總結(jié)

          其實(shí)讀到最后你會(huì)發(fā)現(xiàn),這些容器格式內(nèi)部對(duì)于音視頻數(shù)據(jù)的處理都是大同小異的,區(qū)別點(diǎn)其實(shí)并不大。更多的差距在于它們對(duì)于不同編碼格式的支持程度、元數(shù)據(jù)的詳細(xì)程度以及對(duì)于是否能夠支持音視頻以外的數(shù)據(jù)。

          而發(fā)展到至今,MP4仍然夠用,在互聯(lián)網(wǎng)時(shí)代扮演著非常重要的角色;MKV在下載黨那里被奉為圭臬;而TS格式仍然在數(shù)字電視系統(tǒng)中被廣泛使用。但在他們之前的格式也不是說非常弱或者不好,只不過可能是他們支持的那些格式?jīng)]落了順帶著把它們也帶沒了,真正像AVI那樣確實(shí)在技術(shù)規(guī)格上落伍的容器并不多。

          而對(duì)于各種容器之間無損互轉(zhuǎn)的事情,小編這里推薦mp4box、mkvtoolnix和強(qiáng)大的ffmpeg這些工具。下一篇系列課堂,我們會(huì)轉(zhuǎn)向在如今多媒體領(lǐng)域中扮演無可替代角色的視頻編碼的變遷史,并且會(huì)看一看未來的AV1和VVC這兩種對(duì)于大眾來說還很陌生的下一代視頻編碼。

          圖網(wǎng)站的踩坑筆記,vue開發(fā)項(xiàng)目中通過api接口獲取到了m3u8格式的音頻,但是有的瀏覽器默認(rèn)不支持,所以需要借助輔助手段來實(shí)現(xiàn),下面介紹詳細(xì)方法。



          什么是m3u8?

          m3u8是m3u的一種,是utf-8格式的,Apple 為了提高流播效率開發(fā)的技術(shù),特點(diǎn)是將流媒體切分為若干 TS 片段(比如每10秒一段),然后通過一個(gè)擴(kuò)展的 m3u 列表文件將這些 TS 片段集中起來供客戶端播放器接收。可以做多碼率的適配,根據(jù)網(wǎng)絡(luò)帶寬,客戶端會(huì)自動(dòng)選擇一個(gè)適合自己碼率的文件進(jìn)行播放,保證視頻流的流暢。

          html5的video標(biāo)簽實(shí)現(xiàn)對(duì)HLS(m3u8格式)的支持方法

          <script src="https://cdn.jsdelivr.net/hls.js/latest/hls.min.js"></script>
          <video id="video"></video>
          <script>
          if(Hls.isSupported()) {
          var video = document.getElementById('video');
          var hls = new Hls();
          hls.loadSource('http://www.streambox.fr/playlists/test_001/stream.m3u8');
          hls.attachMedia(video);
          hls.on(Hls.Events.MANIFEST_PARSED,function() {
          video.play();
          });
          }
          </script>

          來源:http://www.qietu.com/hml5-video-m3u8-hls-min-js/


          主站蜘蛛池模板: 无码人妻久久久一区二区三区| av无码人妻一区二区三区牛牛| 91福利视频一区| 色一情一乱一区二区三区啪啪高| 蜜桃视频一区二区三区| 精品成人乱色一区二区| 真实国产乱子伦精品一区二区三区| 中文乱码人妻系列一区二区| 国产一区二区三区高清视频 | 骚片AV蜜桃精品一区| 美女免费视频一区二区| 影院成人区精品一区二区婷婷丽春院影视 | 亚洲高清一区二区三区电影| 无码国产精品一区二区免费vr| 在线观看免费视频一区| 精品乱码一区内射人妻无码| 国产乱码精品一区二区三区香蕉| 人妻少妇精品视频一区二区三区| 亚洲国产精品一区第二页| 国精品无码A区一区二区| 中文字幕一区二区三区免费视频 | 色狠狠一区二区三区香蕉| 无码人妻精品一区二区三区在线| AV无码精品一区二区三区宅噜噜| 一区二区三区亚洲视频| 秋霞鲁丝片一区二区三区| 国产成人av一区二区三区在线| 国产伦精品一区二区| 国产99精品一区二区三区免费| 精品在线一区二区| 国产情侣一区二区三区| 综合人妻久久一区二区精品| 日本亚洲国产一区二区三区| 中文字幕日韩人妻不卡一区| 97精品国产福利一区二区三区| 日韩AV无码一区二区三区不卡毛片| 国产剧情国产精品一区| 亚洲一区二区三区在线观看蜜桃| 精品人妻无码一区二区三区蜜桃一| 国产午夜精品一区二区三区极品 | 国产一区二区三区夜色|