HTML5的Video標簽有部分MP4無法播放的問題解析(多圖)

現(xiàn)在網(wǎng)頁視頻的應(yīng)用極為廣泛,在實際項目中發(fā)現(xiàn)有些MP4文件可以在H5網(wǎng)頁中正常播放,但有些卻不行,這是為什么呢?
1、首先我自己從網(wǎng)上下載的一個MP4文件,IE10和谷歌都能正常播放。然后自己用格式化工廠轉(zhuǎn)換了一個RMVB文件為MP4,然后就不能播放。
如下圖,我選擇MP4格式轉(zhuǎn)換,里面的配置文件也調(diào)了很多遍,但是就是播放不了,IE10完全沒反應(yīng),谷歌倒是能出聲音,但是影像出不來。
2、我直接在文件右擊屬性里面看文件屬性-詳細信息,基本都一樣。
3、我用potplayer播放兩個不同的文件,用potplayer查看2個文件的屬性,發(fā)現(xiàn)了不一樣的地方,
網(wǎng)上下載的能正常使用video標簽播放的視頻屬性如下圖
我們可以看到視頻編碼是AVC
而我自己用格式化工廠轉(zhuǎn)碼的視頻編碼如下
發(fā)現(xiàn)我自己轉(zhuǎn)碼的視頻編碼是mp4v。
4、在格式化工廠里面找到AVC編碼的格式,如下圖
5、選用AVC格式的編碼,重新轉(zhuǎn)碼后,使用video標簽播放就可以正常播放了。
歸根結(jié)底,還是視頻編碼格式的問題,并不是網(wǎng)頁程序的問題。
以上就是這篇文章的全部內(nèi)容了,希望本文的內(nèi)容對大家的學(xué)習(xí)或者工作能帶來一定的幫助~如果有疑問大家可以留言交流,謝謝大家對腳本之家的支持!
相關(guān)文章
使用HTML5在網(wǎng)頁中嵌入音頻和視頻播放的基本方法
這篇文章主要介紹了使用HTML5在網(wǎng)頁中嵌入音頻和視頻播放的基本方法,2016-02-22HTML5 視頻播放(video),JavaScript控制視頻的實例代碼
這篇文章主要介紹了HTML5 視頻播放(video),JavaScript控制視頻的實例代碼,需要的朋友參考下吧2018-10-08html5 移動端視頻video的android兼容(去除播放控件、全屏)
這篇文章主要介紹了html5 移動端視頻video的android兼容,文中通過示例代碼介紹的非常詳細,對大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價值,需要的朋友們下面隨著小編來一起2020-03-26html5 video全屏播放/自動播放的實現(xiàn)示例
這篇文章主要介紹了html5 video全屏播放/自動播放的實現(xiàn)示例,文中通過示例代碼介紹的非常詳細,對大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價值,需要的朋友們下面隨著小編來2020-08-06HTML5 video循環(huán)播放多個視頻的方法步驟
這篇文章主要介紹了HTML5 video循環(huán)播放多個視頻的方法步驟,文中通過示例代碼介紹的非常詳細,對大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價值,需要的朋友們下面隨著小編來2020-08-06- 在html5頁面中嵌入視頻的時候頁面中只顯示聲音卻不顯示圖像,本文主要介紹了HTML5 video播放有聲音無圖像的解決方法,具有一定的參考價值,感興趣的可以了解一下2024-02-21