html5 video微信瀏覽器視頻不能自動播放


html5 video微信瀏覽器視頻不能自動播放

一.微信瀏覽器(x5內核):

1.不能自動播放

2.全屏

3.最頂層(z層的最頂層)

二.ios系統解決方案:(無phone手機未測試)

<audio preload="preload" controls id="car_audio" src="http://media.xitaoinfo.com/ei_zamenjiehunba.mp3" loop></audio> 
<video id="video" controls="" preload="none" mediagroup="myVideoGroup" poster="http://media.w3.org/2010/05/sintel/poster.png"> 
      <source id="mp4" src="http://media.w3.org/2010/05/sintel/trailer.mp4" type="video/mp4"> 
      <source id="webm" src="http://media.w3.org/2010/05/sintel/trailer.webm" type="video/webm"> 
      <source id="ogv" src="http://media.w3.org/2010/05/sintel/trailer.ogv" type="video/ogg"> 
      <p>Your user agent does not support the HTML5 Video element.</p> 
</video> 
<!-- 必須加在微信api資源 --> 
<script src="http://res.wx.qq.com/open/js/jweixin-1.0.0.js"></script> 
<script> 
     //一般情況下,這樣就可以自動播放了,但是一些奇葩iPhone機不可以 
     document.getElementById('car_audio').play(); 
    //必須在微信Weixin JSAPI的WeixinJSBridgeReady才能生效 
    document.addEventListener("WeixinJSBridgeReady", function () { 
        document.getElementById('car_audio').play(); 
        document.getElementById('video').play(); 
    }, false); 
</script> 

三.android系統中解決方案:


誤區:(無效的解決方案)

1.設置video屬性autoplay;

2.通過js調用play();

3.通過js來觸發click事件;

4.使用插件videojs;

5.通過js調用load()然后再調用play();

6.設置video屬性webkit-playsinline="true";

7.touchstart監聽;

8.stalled事件處理;

9.canplaythrogh事件處理;

10.readyState大於2的處理;

11.DOMContentLoaded監聽;

12.微信js api中WeixinJSBridgeReady;

13.微信js api中getNetworkType;

14.白名單;

 

 

 

 

 

 


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM