解決html5中video標簽無法播放mp4問題的辦法


這篇文章主要給大家介紹了關於解決html5中video標簽無法播放mp4問題的辦法,文中介紹的非常詳細,相信會對大家的學習或者工作具有一定的參考學習價值,需要的朋友們下面來一起看看吧。

前言

最近發現了一個問題,在手機錄制了一個1.mp4文件,主流瀏覽器都能正常播放。但使用格式工廠將rmvb文件轉碼為2.mp4卻不能播放。通過查找相關的資料終於解決了,下面分享出來供大家參考學習,下面來看看詳細的介紹:

問題分析

手機錄制的視頻屬性:


 

格式化工廠轉碼的視頻屬性:


 

首先排除代碼問題,路徑問題,瀏覽器不支持等問題。轉碼后的視頻編碼是mp4v,這是不能播放的原因,轉換為AVC(H264)編碼即可。

查閱文檔,關於video標簽所支持的視頻格式和編碼:

  • MPEG4 = 帶有H.264視頻編碼和AAC音頻編碼的MPEG4文件
  • WebM = 帶有VP8視頻編碼和Vorbis音頻編碼的 WebM文件
  • Ogg = 帶有Theora視頻編碼和Vorbis音頻編碼的Ogg文件
     

通過上面的信息我們發現只有h264編碼的MP4視頻(MPEG-LA公司)、VP8編碼的webm格式的視頻(Google公司)和Theora編碼的ogg格式的視頻(iTouch開發)可以支持html5的<video>標簽。

解決方法

video標簽允許多個source元素,source元素可以鏈接不同的視頻文件,瀏覽器將使用第一個可識別的格式,這樣可用來解決瀏覽器兼容問題。

?
1
2
3
4
5
< video controls = "controls" width = "100%" >
   < source src = "1.mp4" type = "video/mp4" >
   < source src = "1.ogg" type = "video/ogg" >
Your browser does not support the video tag.
</ video >

總結

以上就是這篇文章的全部內容了,希望本文的內容對大家的學習或者工作能帶來一定的幫助,如果有疑問大家可以留言交流。


 

參考學習資料

常用軟件開發學習資料目錄:  

1.經典編程電子書收藏  

2.C&C++編程學習資料收藏   

3.算法及數據結構(有關c,c++,java)   

4.Java開發學習資料收藏      

5.Android開發學習資料收藏  

6.Python開發學習資料收藏  

7.大數據,機器學習,人工智能資料收藏

8.Docker資料收藏


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM