javascript采用Broadway实现安卓视频自动播放的方法(这种坑比较多 不建议使用)
javascript采用Broadway实现安卓视频自动播放的方法
Broadway 是一个 H.264 解码器, 比jsmpge清晰度要高 使用 Emscripten 工具从 Android 的 H.264 解码器转化而成,它还针对 WebGL 做了一些优化。
1 先把mp4要转下 ffmpeg -i in.mp4 -s 500x804 -vcodec libx264 -pass 1 -coder 0 -bf 0 -flags -loop -wpredp 0 out.mp4
2 代码如下
<pre>
<html>
<head>
<link type="text/css" href="screen.css" rel="stylesheet" />
</head>
<body onload="load()">
<script src="/moban/js/jquery.min.js"></script>
<script type="text/javascript" src="Decoder.js"></script>
<script type="text/javascript" src="YUVCanvas.js"></script>
<script type="text/javascript" src="Player.js"></script>
<script type="text/javascript" src="stream.js"></script>
<script type="text/javascript" src="mp4.js"></script>
<script type="text/javascript">
function load() {
var broadwaynode=$('.broadway')[0];
var broadway = new Broadway(broadwaynode);
broadway.play();
}
</script>
<div class="broadway" src="mozilla_story.mp4" width="640" height="360" style="float: left; position: relative;" workers="false" render="true" webgl="auto"></div>
</body>
</html>
// 用绝对定位是为了挡住下面的调试信息
canvas{
width: 100%;
height: 100%;
position: absolute;
left: 0px;
top: 0px;
z-index: 101;
}
var broadwaynode=$('.broadway')[0];
var broadway = new Broadway(broadwaynode);
broadway.play();
</pre>
3 官网资料 https://github.com/mbebenita/Broadway
ps:Unrecognized option 'wpredp'这个错误 说明 ffmpge不完整 建议用win版本
javascript采用Broadway实现安卓视频自动播放的方法(这种坑比较多 不建议使用)的更多相关文章
- 网页背景H5视频自动播放---PC端、移动端兼容问题完美解决方案(IOS、安卓、微信端)
最近公司官网需要使用视频当做banner背景且自动播放,并且因为是官网需要做到PC端和移动端都可以适配兼容,这些问题很是头疼: 兵来将挡,水来土掩,进过查阅相关技术资料,现已完美兼容PC端和移动端.下 ...
- 新版微信h5视频自动播放
微信最近升级了新版本,直播视频不能自动播放,经过了一番探索,发现下列方法可以实现自动播放. if (typeof WeixinJSBridge == "undefined") { ...
- iOS 微信 音频 视频自动播放
iOS 微信 音频 视频自动播放 http://www.w3ctech.com/topic/1165
- h5中嵌入视频自动播放的问题
在H5页面中嵌入视频的情况是比较多件的,有时候会碰到需要自动播放的情况,之前根本觉得这不是问题,但是自己的项目中需要视频的时候就有点sb了,达不到老板的要求,那个急呀~~~ 各种查资料,找到一个方法, ...
- Android 中WebView中video视频自动播放
转载于https://juejin.im/post/5d5ac7eb51882562744fae37 如果有使用过Android的WebView 播放视频的伙伴们一定会发现, 在点开视频网页的时候并没 ...
- 手机端 video 视频自动播放方法
//创建一个video标签 var __video = $("#video").appendTo('.i-i-video'); //设置视频文件地址 __video.attr('s ...
- Chrome,firefox解除阻止视频自动播放
Firefox 66 将阻止自动播放音频和视频 PingWest品玩2月5日报道,从发布适用于桌面的 Firefox 66 和 Firefox for Android 开始,Firefox 将默认阻止 ...
- iOS苹果和微信中音频和视频实现自动播放的方法
通过下面的方式可以解决,在iPhone手机微信中正常自动播放. 必须在微信Weixin JSAPI的WeixinJSBridgeReady才能生效,猜测微信接口做了处理~ <audio prel ...
- H5-video1 iOS苹果和微信中音频和视频实现自动播放的方法
<audio preload="preload" controls id="car_audio" src="http://media.xitao ...
随机推荐
- 我眼中的如何成为一名合格的PHP高级开发工程师
转眼间搞PHP已超过10年准确的说12年,混在帝都,也经历过大公司小公司,有个同行朋友问我,我就思考下,如何成为一名合格的PHP高级开发 所有的所有仅限综合知识,因为PHP其实内容也很多,有的人专门研 ...
- Maven下载速度过慢问题已解决
因为Maven 默认仓库的服务器在国外所以我们国内的使用效果极差,我们可以修改成为国内镜像地址加速下载. 两种方法 修改全局文件 C:\Users\您电脑帐号\ .m2\settings.xml没有文 ...
- Windows API 编程入门
Windows 工作原理的中心思想就是“动态链接”概念.Windows 自身带有一大套函数,应用程序就是通过调用这些函数 来实现它的用户界面和在屏幕上显示文本和图形的.这些函数都是在动态链接库里实现的 ...
- 实验吧之【who are you?】(时间盲注)
地址:http://ctf5.shiyanbar.com/web/wonderkun/index.php 这道题点开看见your ip is :xxx.xxx.xx.xxx 试了一些 最后发现是XFF ...
- 用JavaScript制作banner轮播图
JavaScript_banner轮播图 让我们一起来学习一下用js怎么实现banner轮播图呢? 直接看代码: <!DOCTYPE html> <html> <head ...
- 关于JavaScript if...else & if 判断简写
<script type="text/javascript"> 如果你想写 if (!false){ alert('false'); } 不妨考虑写成: false | ...
- 玩转OneNET物联网平台之MQTT服务④ —— 远程控制LED(设备自注册)+ Android App控制
授人以鱼不如授人以渔,目的不是为了教会你具体项目开发,而是学会学习的能力.希望大家分享给你周边需要的朋友或者同学,说不定大神成长之路有博哥的奠基石... QQ技术互动交流群:ESP8266&3 ...
- 算法随笔-二叉树遍历的N种姿势
最近在练习用Python刷算法,leetcode上刷了快300题.一开始怀疑自己根本不会写代码,现在觉得会写一点点了,痛苦又充实的刷题历程.对我这种半路出家的人而言,收获真的很大. 今天就从二叉树遍历 ...
- 处理 Could not find a 'KafkaClient' entry in the JAAS configuration. System property 'java.security.auth.login.config' is
场景 某监控进程需要访问多个集群的Kafka INFO - org.apache.kafka.common.KafkaException: Failed to construct kafka cons ...
- 函数基础(三) 装饰器\闭包 day 12
目录 昨日回顾 可变长参数 * ** 函数对象 函数嵌套 名称空间和作用域 今日内容 闭包函数 装饰器 语法糖 装饰器模板 迭代器 昨日回顾 可变长参数 * *形参:接受多余的位置实参 *实参(可迭代 ...