首页 » 文章随笔 » 技巧教程 » 如何快速让cef、wke、blink等支持mp4和mp3(支持html5的video和audio标签)?

如何快速让cef、wke、blink等支持mp4和mp3(支持html5的video和audio标签)?

在cef中,默认是不支持mp3和mp4的,使用cef控件写的软件打开带有video或audio标签的视频或音频是会播放失败的!一种方法就是自己重新编译cef的库,加入支持mp3和mp4的支持。如何编译看这篇文章 如何让dcef3支持mp3和h.264 mp4解码播放(有源码及dll)!

这是从文件的本身出发,修改后支持mp3和mp4,从另一方面来说,采用cef的精简版控件,比如wke,blink或低版本的ie等,修改文件重新编译支持mp3和mp4的方法就不可行了!能不能不修改文件直接支持mp3和mp4的video和audio标签呢?这儿介绍一种修改html本身而不动浏览器控件文件的解决方法,当然你得有修改html文件的权限。

使用html5media让浏览器兼容<Video><Audio> 标签。html5media是一个开源项目

html5media 官网:https://html5media.info/
html5media 项目:https://github.com/etianen/html5media
html5media Wiki:https://github.com/etianen/html5media/wiki

html5media 官网CDN:http://api.html5media.info/1.2.2/html5media.min.js
html5media 国内CDN:http://www.bootcdn.cn/html5media/

如何使用html5media?它只需要一行代码就可以使HTML5的video和audio标签在所有主流浏览器中都能正常工作。只需要在html的head文档中添加如下代码

< script src = “ http://api.html5media.info/1.1.8/html5media.min.js ” > </ script >

然后按照html5的video标签添加的视频

< video src="video.mp4" preload="" controls="controls" width="320" height="200">

按照html5的audio标签添加的音频

<audio src="audio.mp3" controls preload>

都可以正常播放了!

html5media的原理就是把不支持<Video><Audio>标签的替换为使用flash播放!

这样使用html5media后,cef、wke、blink等所有浏览器都支持html5的video和audio标签了!

如果你是使用wke或blink在自己的程序界面中添加显示mp4或mp3,那么你需要自己把html5media.min.js和flowplayer.audio.swf flowplayer.controls.swf flowplayer.swf文件全部下载到你的程序目录(js文件和swf放在同一目录),在你的程序中就可以在wke或blink中使用video或audio标签了!

未经允许不得转载:百脑问 » 如何快速让cef、wke、blink等支持mp4和mp3(支持html5的video和audio标签)?

×

感谢您的支持,我们会一直保持!

扫码支持
请土豪扫码随意打赏

打开微信扫一扫,即可进行扫码打赏哦

分享从这里开始,精彩与您同在

分享到:更多 ()

评论 抢沙发

评论前必须登录!

百脑问 创新坚持 杰然不同

赞助我们联系我们
数据查询次数:19 消耗时间:0.500 秒, 使用内存: 19.39MB
您好,有什么可以帮您吗!