javascript html5视频播放器

JavaScript010

javascript html5视频播放器,第1张

款很棒的 HTML5 视频播放器作为下一代的网页语言,HTML5 拥有很多让人期待已久的新特性,其中之一就是 video 标签,让开发者可以在网页中和添加图片一样简单的方式添加视频。1、VideoJSVideoJS 是最流行的 HTML5 视频播放器,免费、开源,可使用 CSS 轻松定制皮肤,支持全屏,在不支持的浏览器自动切换为 Flash 播放。2、SublimeVideoSublimeVideo 是一个独特的基于云概念的 HTML5 视频播放器,功能强大,可惜不是免费的。3、Open Standard Media (OSM) Player由 Alethia Inc 开发,是集全功能于一体的网络播放器,非常不错。4、Video for EverybodyVideo for Everybody 让你在网页中嵌入一小段代码就能支持 HTML5 视频,在不支持的浏览器中自动切换为 Flash 播放。5、Kaltura HTML5Kaltura 的 HTML5 视频解决方案 – 兼容所有主流浏览器,采用独特的 fallback 机制。6、FlareVideoFlareVideo 由 Alex MacCaw 开发,他是一位Ruby/JS开发者,FlareVideo主要特色:在不支持 HTML5 视频的情况,用Flash作为替代方案可轻松自定义主题支持全屏完全开源和免费用于商业用途7、Projekktor全文

(function(){

var option ={"auto_play":"0","file_id":"16092504232103639705","app_id":"1251580615","width":screen.width,"height":screen.height}/*调用播放器进行播放*/

new qcVideo.Player( /*代码中的id_video_container将会作为播放器放置的容器使用,可自行替换*/ "id_video_container", option )})()

最近因为项目需要播放flv格式视频文件,但我使用是html5的vedio标签进行播放,它支持3种视频格式:mp4,WebM,Oog,是不支持的flv格式,无奈,好在网上不少大神佳作。解决我困境。

在vue项目中安装flv.js文件

npm i flv.js --save

将flv.js文件导入相关组件中。

创建video元素标签来播放视频内容。

flvjs.isSupported()是否支持,若支持。则 flvjs.createPlayer创建flv播放器对象,加载到video元素中进行播放即可

参考文档

https://www.bysb.net/2943.html

https://blog.csdn.net/weixin_45316326/article/details/99053910