html5的視頻支持格式

HTML5和瀏覽器對視頻和音頻文件格式都有嚴(yán)格的要求，僅有少數(shù)幾種視頻和音頻格式的文件能夠同時滿足HML5和瀏覽器的需求。

創(chuàng)新互聯(lián)公司專注為客戶提供全方位的互聯(lián)網(wǎng)綜合服務(wù)，包含不限于成都做網(wǎng)站、網(wǎng)站建設(shè)、外貿(mào)營銷網(wǎng)站建設(shè)、伊犁網(wǎng)絡(luò)推廣、微信小程序定制開發(fā)、伊犁網(wǎng)絡(luò)營銷、伊犁企業(yè)策劃、伊犁品牌公關(guān)、搜索引擎seo、人物專訪、企業(yè)宣傳片、企業(yè)代運營等，從售前售中售后，我們都將竭誠為您服務(wù)，您的肯定，是我們最大的嘉獎；創(chuàng)新互聯(lián)公司為所有大學(xué)生創(chuàng)業(yè)者提供伊犁建站搭建服務(wù)，24小時服務(wù)熱線：18980820575，官方網(wǎng)址：www.rwnh.cn

因此想要在網(wǎng)頁中嵌入視頻和音頻文件，首先要選擇正確的視頻和音頻文件格式。下面將對HTML5中視頻和音頻的一些常見格式以及瀏覽器的支持情況做具體介紹。

1、HTML5支持的視頻格式在HTML5中嵌入的視頻格式主要包括ogg、mpeg4、wehm等，具體介紹如下。

ogg：一種開源的視頻封裝容器，其視頻文件擴展名為ogg，里面可以封裝vobris音頻編碼或者theora視頻編碼，同時ogg文件也能將音頻編碼和視頻編碼進行混合封裝。

mpeg4：目前最流行的視頻格式，其視頻文件擴展名為mp4。

同等條件下，mpeg4格式的視頻質(zhì)量較好，但它的專利被MPEG－LA公司控制，任何支持播放mpeg4視頻的設(shè)備，都必須有一張MPEG－LA頒發(fā)的許可證。

目前MPEG－LA規(guī)定，只要是互聯(lián)網(wǎng)上免費播放的視頻，均可以無償獲得使用許可證。Webm：由Google發(fā)布的一個開放、免費的媒體文件格式，其視頻文件擴展名為webm。

由于webm格式的視頻質(zhì)量和mpeg4較為接近，并且沒有專利限制等問題，webm已經(jīng)被越來越多的人所使用。推薦了解傳智播客web前端培訓(xùn)6．5版本課程。

2．HTML5支持的音頻格式在HTML5中嵌入的音頻格式主要包括ogg、mp3、wav等，具體介紹如下。

ogg：當(dāng)ogg文件只封裝音頻編碼時，它就會變成為一個音頻文件。ogg音頻文件擴展名為ogg。ogg音頻格式類似于mp3音頻格式，不同的是，ogg格式完全免費并且沒有專利限制。

同等條件下，ogg格式音頻文件的音質(zhì)、體積大小優(yōu)于mp3音頻格式。mp3：目前主流的音頻格式，其音頻文件擴展名為mp3。

同mpeg4視頻格式一樣，mp3音頻格式也存在專利、版權(quán)等諸多的限制，但因為各大硬件提供商的支持使得mp3依靠其豐富的資源、良好的兼容性仍舊保持較高的使用率。

wav：微軟公司（Microsoft）開發(fā)的一種聲音文件格式，其擴展名為wav。作為無損壓縮的音頻格式，wav的音質(zhì)是三種音頻格式文件中最好的，但其體積也是最大的。

wav音頻格式最大的優(yōu)勢是被Windows平臺及其應(yīng)用程序廣泛支持，是標(biāo)準(zhǔn)的Windows文件。

擴展資料：

html5的智能表單：

表單是實現(xiàn)用戶與頁面后臺交互主要組成部分，HTML5在表單的設(shè)計上功能更加強大。

input類型和屬性的多樣性大大地增強了HTML可表達的表單形式，再加上新增加的一些表單標(biāo)簽，使得原本需要JavaScript來實現(xiàn)的控件，可以直接使用HTML5的表單來實現(xiàn)。

一些如內(nèi)容提示、焦點處理、數(shù)據(jù)驗證等功能，也可以通過HTML5的智能表單屬性標(biāo)簽來完成。

html5 能不能播放實時視頻流

可以的。

是一樣的，就是實時流數(shù)據(jù)怎么放到video標(biāo)簽

只要獲取到實時數(shù)據(jù)，你就按照協(xié)議組成包就可以了

求采納，謝謝

如何用HTML5 在網(wǎng)頁內(nèi)顯示PC的實時視頻

HTML5技術(shù)支持WebApp在手機上拍照，顯示在頁面上并上傳到服務(wù)器。這是手機微博應(yīng)用中常見的功能，當(dāng)然你也可以在其它類型應(yīng)用中適當(dāng)使用此技術(shù)。

1、 視頻流

HTML5 的 The Media Capture（媒體捕捉） API 提供了對攝像頭的可編程訪問，用戶可以直接用 getUserMedia （請注意目前僅Chrome和Opera支持）獲得攝像頭提供的視頻流。我們需要做的是添加一個HTML5 的 Video 標(biāo)簽，并將從攝像頭獲得的視頻作為這個標(biāo)簽的輸入來源。

video id=”video” autoplay=”"/video

script

var video_element=document.getElementById(‘video’);

if(navigator.getUserMedia){ // opera應(yīng)使用opera.getUserMedianow

navigator.getUserMedia(‘video’,success,error); //success是回調(diào)函數(shù),當(dāng)然你也可以直接在此寫一個匿名函數(shù)

}

function success(stream){

video_element.src=stream;

}

/script

此時，video 標(biāo)簽內(nèi)將顯示動態(tài)的攝像視頻流。下面需要進行拍照了。

2、 拍照

拍照是采用HTML5的Canvas功能，實時捕獲Video標(biāo)簽的內(nèi)容，因為Video元素可以作為Canvas圖像的輸入，所以這一點很好實現(xiàn)。主要代碼如下：

var canvas=document.createElement(‘canvas’); //動態(tài)創(chuàng)建畫布對象

var ctx=canvas.getContext(’2d’);

var cw=vw,ch=vh;

ctx.fillStyle=”#ffffff”;

ctx.fillRect(0,0,cw,ch);

ctx.drawImage(video_element,0,0,cw,ch,0,0,vw,vh); //將video對象內(nèi)指定的區(qū)域捕捉繪制到畫布上指定的區(qū)域，可進行不等大不等位的繪制。

document.body.append(canvas);

3、 圖片獲取

從Canvas獲取圖片數(shù)據(jù)的核心思路是用canvas的toDataURL將Canvas的數(shù)據(jù)轉(zhuǎn)換為base64位編碼的PNG圖像，類似于“data:image/png;base64,xxxxx”的格式。

var imgData=canvas.toDataURL(“image/png”);

這樣，imgData變量就存儲了一長串的字符數(shù)據(jù)內(nèi)容，表示的就是一個PNG圖像的base64編碼。因為真正的圖像數(shù)據(jù)是base64編碼逗號之后的部分，所以要讓實際服務(wù)器接收的圖像數(shù)據(jù)應(yīng)該是這部分，我們可以用兩種辦法來獲取。

第一種：是在前端截取22位以后的字符串作為圖像數(shù)據(jù)，例如：

var data=imgData.substr(22);

如果要在上傳前獲取圖片的大小，可以使用：

var length=atob(data).length; //atob 可解碼用base-64解碼的字串

第二種：是在后端獲取傳輸?shù)臄?shù)據(jù)后用后臺語言截取22位以后的字符串（也就是在前臺略過上面這步直接上傳）。例如PHP里：

$image=base64_decode(str_replace(‘data:image/jpeg;base64,’,”,$data);

4、 圖片上傳

在前端可以使用Ajax將上面獲得的圖片數(shù)據(jù)上傳到后臺腳本。例如使用jQuery時可以用：

$.post(‘upload.php’,{‘data’:data});

在后臺我們用PHP腳本接收數(shù)據(jù)并存儲為圖片。

function convert_data($data){

$image=base64_decode(str_replace(‘data:image/jpeg;base64,’,”,$data);

save_to_file($image);

}

function save_to_file($image){

$fp=fopen($filename,’w');

fwrite($fp,$image);

fclose($fp);

}

以上的解決方案不僅能用于Web App拍照上傳，也可以通過Canvas的編輯功能函數(shù)提供圖片編輯，例如裁剪、上色、涂鴉、圈點等功能，然后把用戶編輯完的圖片上傳保存到服務(wù)器上。

在還在不斷補充修正的HTML5的驅(qū)動下，Web App與Native App之間的距離將越來越小。在可預(yù)見的不遠的未來，越來越多老的和新的開發(fā)項目必將會遷移到WEB應(yīng)用上來。

html5如何實現(xiàn)自動播放視頻？

HTML5 是下一代的 HTML， 提供了展示視頻的標(biāo)準(zhǔn)，規(guī)定了一種通過 video 元素來包含視頻的標(biāo)準(zhǔn)方法。

Video有以下的屬性。

autoplay autoplay 如果出現(xiàn)該屬性，則視頻在就緒后馬上播放。

controls controls 如果出現(xiàn)該屬性，則向用戶顯示控件，比如播放按鈕。

height pixels 設(shè)置視頻播放器的高度。

loop loop 如果出現(xiàn)該屬性，則當(dāng)媒介文件完成播放后再次開始播放。

preload preload 如果出現(xiàn)該屬性，則視頻在頁面加載時進行加載，并預(yù)備播放。

如果使用 "autoplay"，則忽略該屬性。

src url 要播放的視頻的 URL。

width pixels 設(shè)置視頻播放器的寬度。

其中，如果想要實現(xiàn)自動播放，可以在Video里面加上autoplay屬性就可以了。

關(guān)于HTML5 的播放大體積視頻文件的問題

播放大視頻文件等待下載時間過長的缺陷，本身就不是HTML5的問題，服務(wù)器問題和視頻格式問題。

Flash插件播放fla的傳統(tǒng)方式上：這個現(xiàn)在YOUKU基本上FLV格式。建議在服務(wù)器上裝流媒體服務(wù)，然后用HTML5點播地址，不要直接HTML5讀取視頻地址，沒人會這樣做除非只是非常小，非常短的的視頻文件。

相對于下載后觀看的網(wǎng)絡(luò)播放形式而言，流媒體的典型特征是把連續(xù)的音頻和視頻信息壓縮后放到網(wǎng)絡(luò)服務(wù)器上，用戶邊下載邊觀看，而不必等待整個文件下載完畢。由于流媒體技術(shù)的優(yōu)越性，該技術(shù)廣泛應(yīng)用于視頻點播、視頻會議、遠程教育、遠程醫(yī)療和在線直播系統(tǒng)中。

相關(guān)信息

sewise流媒體服務(wù)器軟件系統(tǒng)是一整套流媒體編碼、分發(fā)和存儲的軟件系統(tǒng)，包含直播、點播、虛擬直播、剪切、轉(zhuǎn)碼、視頻管理系統(tǒng)。這些軟件支持多屏多系統(tǒng)播放，終端客戶使用手機、平板、電腦、電視等終端，ios、安卓、windows、linux等系統(tǒng)，都能支持播放。

點播服務(wù)器軟件：支持mp4、flv、mov、ts、wmv、mkv、rmvb等多種類型的文件上傳；支持2種上傳方式，可上傳大文件；支持H.264/AAC編碼；強大的服務(wù)端實時轉(zhuǎn)碼能力，轉(zhuǎn)碼輸出3種不同碼率的視頻文件；支持web應(yīng)用播放需求及android系統(tǒng)、ios系統(tǒng)播放需求。

html5如何實現(xiàn)自動播放視頻

我們使用html5的video標(biāo)簽，可以不依賴于任何第三方的插件或控件，直接在瀏覽器中實現(xiàn)視頻播放功能。

在了解了video標(biāo)簽之后，下面我們就使用html5的video標(biāo)簽來實現(xiàn)視頻播放。

現(xiàn)在，我們打開瀏覽器，看一看具體的效果：

為了更好地兼容各種瀏覽器，你可以為一個video標(biāo)簽添加多個source子標(biāo)簽，每個source標(biāo)簽引用一個不同格式的視頻文件。這樣，html5瀏覽器會自動在這些source標(biāo)簽中從上到下依次尋找并識別出該瀏覽器可以播放的第一個視頻文件并進行播放，從而實現(xiàn)兼容多個瀏覽器的視頻播放功能。

注：html5的video標(biāo)簽?zāi)壳爸恢С植シ?mp4、.ogg、.webm等幾種格式的視頻文件，暫不支持其他格式的視頻文件。此外，不同的html5瀏覽器支持的視頻文件格式也略有不同，這種狀況可能會在未來的html5中得以改善。

名稱欄目：html5實時視頻的簡單介紹
本文網(wǎng)址：http://www.rwnh.cn/article14/phpide.html

成都網(wǎng)站建設(shè)公司_創(chuàng)新互聯(lián)，為您提供企業(yè)網(wǎng)站制作、Google、域名注冊、標(biāo)簽優(yōu)化、搜索引擎優(yōu)化、微信小程序

廣告

聲明：本網(wǎng)站發(fā)布的內(nèi)容（圖片、視頻和文字）以用戶投稿、用戶轉(zhuǎn)載內(nèi)容為主，如果涉及侵權(quán)請盡快告知，我們將會在第一時間刪除。文章觀點不代表本網(wǎng)站立場，如需處理請聯(lián)系客服。電話：028-86922220；郵箱：631063699@qq.com。內(nèi)容未經(jīng)允許不得轉(zhuǎn)載，或轉(zhuǎn)載時需注明來源： 創(chuàng)新互聯(lián)