基于Html5的兼容所有主流浏览器的在线视频播放器videoJs

在一个新的项目上需要实现在线视频播放,原本打算借助优酷的视频存储和播放,但是发现这个需要用户注册优酷账户,严重影响用户体验,于是这个方案被毙掉了。于是开始了自己开发一个在线播放器的想法,当然尽量使用已有的开源播放器。忽然想到html5的video和audio可以实现视频和音频的播放。大喜,晚上搜索html5播放器,发现很多国外开发的很漂亮的html5播放器,其中就有videojs。由于videojs能够根据IE版本判断是否支持html5,若是不支持切换到flash播放器进行播放。看到这一点很满意果断选择videojs作为在线视频播放器,于是开始了后面的几天的漫漫调试之路。

videojs不需要第三方js库,所以相对很简单,大家可以从官网http://www.videojs.com/上面直接下载。测试环境windows2003 + IIS6。在测试过程中由于没有对网站设置MIME类型进行设置,在所有的浏览器上都无法播放,通过firebug发现404,视频源文件和vjs.woff找不到,于是IIS中的MIME设置中添加了以下video/mpeg 和 application/x-font-woff这两个MIME类型。添加之后在IE9以上版本测试一直无法播放,但是videojs的官方视频可以播放,一直很纳闷,研究了很久不得其所。最后通过IE的toolbar工具发现提示不是支持的视频或音频格式,于是上网搜索.mp4的MIME类型为video/mp4。修改后测试了firefox、chrome、360安全/极速浏览器、IE6/7/8/9,嘿嘿,都可以播放,很高兴,没有白忙活这段时间。

研究这个在线播放器也算积累些HTML5的一些基础知识,目前html5的视频编码格式分为3中,又一个不统一,搞死开发人员。

基于Html5的兼容所有主流浏览器的在线视频播放器videoJs

上一篇:分享一个基于HTML5实现的视频播放器


下一篇:下载并在Eclipse中关联Android源代码