OS 微信 音频 视频自动播放
(2017-07-05 16:54:20)[<cite style="font-style: normal; font-family: Verdana; cursor: pointer !important; text-decoration: none;">编辑</cite>][[<cite onclick="$articleManage('166b5ae740102xqkg',1,{callback:function(){window.location.href='http://blog.sina.com.cn/u/6018150004';}});" style="font-style: normal; font-family: Verdana; cursor: pointer !important; text-decoration: none;">删除</cite>]](javascript:;)
[<cite style="font-style: normal; line-height: 23px; padding: 0px 20px 0px 32px; display: inline-block !important; height: 23px; background-repeat: no-repeat; background-position: right -28px; min-width: 1px; overflow-x: visible; white-space: nowrap; text-align: left; font-size: 12px !important; background-image: url("../../../image/4/4_11/images/sg_newsp.png"); width: 34px;">转载▼</cite>](javascript:;)
| | |
iPhone手机音频、视频无法自动播放?
在做爆米兔的时候,遇到上面的问题,各种尝试都没有结果。最后发现:
通过下面的方式可以解决,在iPhone手机微信中正常自动播放。
必须在微信Weixin JSAPI的WeixinJSBridgeReady才能生效,猜测微信接口做了处理~
可以用iPhone手机在微信中打开这里,查看效果~
测试了90%的iPhone机型,大部分直接调用audio的play方法就可以自动播放了,但是一些奇葩iPhone机不可以
preload="preload" controls id="car_audio" src="http://media.xitaoinfo.com/ei_zamenjiehunba.mp3" loop>
id="video" controls="" preload="none" mediagroup="myVideoGroup" poster="http://media.w3.org/2010/05/sintel/poster.png">
id="mp4" src="http://media.w3.org/2010/05/sintel/trailer.mp4" type="video/mp4">
id="webm" src="http://media.w3.org/2010/05/sintel/trailer.webm" type="video/webm">
id="ogv" src="http://media.w3.org/2010/05/sintel/trailer.ogv" type="video/ogg">
Your user agent does not support the HTML5 Video element.
//一般情况下,这样就可以自动播放了,但是一些奇葩iPhone机不可以
document.getElementById('car_audio').play();
//必须在微信Weixin JSAPI的WeixinJSBridgeReady才能生效
document.addEventListener("WeixinJSBridgeReady", function () {
document.getElementById('car_audio').play();
document.getElementById('video').play();
}, false);
@Nokey 提问:最近又发现一个问题,Android不能同时播放两个音频? @李猜猜回答:因为ready只会触发一次,所以不能播放多个音频。但是如果需要播放多个音频,其实只要调用一下eixinJSBridge进行包裹即可。 示例代码如下
function playAudio() {
if (setting.autoplay) {
if (window.WeixinJSBridge) {
WeixinJSBridge.invoke('getNetworkType', {}, function (e) {
audio.play();
}, false);
} else {
document.addEventListener("WeixinJSBridgeReady", function () {
WeixinJSBridge.invoke('getNetworkType', {}, function (e) {
audio.play();
});
}, false);
}
audio.play();
} else {
audio.pause();
}
return false;
}