ICode9

精准搜索请尝试: 精确搜索
首页 > 其他分享> 文章详细

解决微信浏览器video视频自动播放的问题

2022-08-27 15:00:09  阅读:365  来源: 互联网

标签:微信 player video 自动播放 Android true x5


<video controls="controls" src="" id="video" 
x5-video-player-type="h5"
preload="metadata"
playsinline="true" webkit-playsinline="true"
x-webkit-airplay="true"
x5-video-orientation="portraint"
x5-video-player-fullscreen="true">
</video>

1.playsinline="true" webkit-playsinline="true 解决ios自动播放全屏问题

2.x5-video-player-type="h5" x5-video-player-fullscreen="true" 解决安卓同层级播放

3.ios微信下通过 WeixinJSBridgeReady 事件进行自动播放,这个方法在安卓微信浏览器不生效

  //引入链接
  <script src="http://res.wx.qq.com/open/js/jweixin-1.4.0.js"></script> 
 
  //必须在微信Weixin JSAPI的WeixinJSBridgeReady才能生效
    document.addEventListener("WeixinJSBridgeReady", function () {
     document.getElementById('video').play();
    }, false)

4.最后安卓微信浏览器解决方法是触摸播放:

(这样ios还是自动播放,只有在安卓端微信浏览器是触摸播放)

  //判断是否是Android端打开链接
  if (navigator.userAgent.indexOf("Android") > 0) {
     //如果是Android的话,在判断是否是微信端打开链接
    function is_weixn(){  
   var ua = navigator.userAgent.toLowerCase();  
    if(ua.match(/MicroMessenger/i)=="micromessenger") {  
        return true;  
    } else {  
        return false;  
    }  
}  
//如果是在Android端微信打开 触摸播放
if( is_weixn() ) {
   document.addEventListener('touchstart', function() {
   document.getElementById('bgVid').play()
     })
} else {
}

 

 

标签:微信,player,video,自动播放,Android,true,x5
来源: https://www.cnblogs.com/angel648/p/16630562.html

本站声明: 1. iCode9 技术分享网(下文简称本站)提供的所有内容,仅供技术学习、探讨和分享;
2. 关于本站的所有留言、评论、转载及引用,纯属内容发起人的个人观点,与本站观点和立场无关;
3. 关于本站的所有言论和文字,纯属内容发起人的个人观点,与本站观点和立场无关;
4. 本站文章均是网友提供,不完全保证技术分享内容的完整性、准确性、时效性、风险性和版权归属;如您发现该文章侵犯了您的权益,可联系我们第一时间进行删除;
5. 本站为非盈利性的个人网站,所有内容不会用来进行牟利,也不会利用任何形式的广告来间接获益,纯粹是为了广大技术爱好者提供技术内容和技术思想的分享性交流网站。

专注分享技术,共同学习,共同进步。侵权联系[81616952@qq.com]

Copyright (C)ICode9.com, All Rights Reserved.

ICode9版权所有