·您当前的位置:主页 > 技术教程 > Html5技术 >

[html5]判断浏览器是否支持播放这种视频格式canPlayType方法

时间:2017-11-01 14:24酷播
与使用向网页中添加 HTML5 视频控件中所示的 source 元素相比,从 JavaScript 中确定要使用的格式稍微复杂一点

与使用向网页中添加 HTML5 视频控件中所示的 source 元素相比,从 JavaScript 中确定要使用的格式稍微复杂一点。但是,由于视频元素的支持不会更改,因此在你确定可用的支持之后,便可以为余下的浏览 会话进行格式假设。 若要查找浏览器的格式功能,请使用 video 对象的 canPlayType 方法。 canPlayType 方法带有一个视频 MIME 类型以及一个可选的编解码器参数,并且返回三个字符串之一:"empty"、"maybe" 或 "probably"。

  1.  if (myvideo.canPlayType) { 
  2.     // CanPlayType returns maybe, probably, or an empty string. 
  3.     var playMsg = myvideo.canPlayType('video/mp4; codecs="avc1.42E01E"'); 
  4.     if ("" != playMsg) { 
  5.       msg.innerHTML += "mp4/H.264 is " + playMsg + " supported <br/>"; 
  6.     } 
  7.     playMsg = myvideo.canPlayType('video/ogg; codecs="theora"'); 
  8.     if ("" != playMsg) { 
  9.       msg.innerHTML += "ogg is " + playMsg + " supported<br/>"; 
  10.     } 
  11.     playMsg = myvideo.canPlayType('video/webm; codecs="vp8, vorbis"'); 
  12.     if ("" != playMsg) { 
  13.       msg.innerHTML += "webm is " + playMsg + " supported<br/>"; 
  14.     } 
  15.   } 
  16.   else { 
  17.     msg.innerHTML += "no video support"; 
  18.   } 

"maybe" 和 "probably" 之间的差别通常是 canPlayType 方法没有足够的信息。例如,如果缺少编解码器参数,则该方法可返回 "maybe" 以便支持 mp4。这是因为可能有不受支持的 mp4 编解码器。编解码器参数将这种支持限制为更具体的 mp4 文件版本。
canPlayType 方法返回的这三种不明确的状态使得确定浏览器是否支持该文件格式成为一项挑战。尽管不是规则,但如果浏览器返回 "maybe",则通常表明该浏览器可以支持该格式。如果返回的字符串为 "maybe"、"probably",则以下语句返回布尔型 true,如果字符串为空,则返回 false。

热门文章

请稍候...
  • 热身双十一,锁定云视频大聚惠
  • 备战双十一,相约直播超值狂欢
保利威视云直播
保利威视云视频
微信付费直播
酷播云免费在线视频整体解决方案
酷播v4.0网页播放器