微信无法自动播放网站手机端浏览器video标签视频失效

微信无法播放网站手机端视频微信浏览器video标签自动播放视频失效解决方法教程附带代码

视频播放html代码如下：

1. <video id="videoPlay" class="video" autoplay="autoplay" loop="loop" playsinline="true"   preload="auto"  poster="" height="100%" style="text-align: -webkit-center; margin: 0 auto;" controls="">
   
2.   <source src="/20220217.mp4" type="video/mp4" />
   
3.   <source src="/20220217.mp4" type="video/ogg" />
   
4.   <source src="/20220217.mp4" type="video/webm" />
   
5. Your browser does not support the video tag.
   
6. </video>

复制代码

js代码如下：

1. (function () {
   
2.             //触屏即加载音乐
   
3. 
   
4.             // document.addEventListener('touchstart', function() {undefined
   
5.             // document.getElementById('media').play()
   
6.             // }
   
7. 
   
8.              //进入微信页面即加载
   
9.             // document.addEventListener('WeixinJSBridgeReady', function() {undefined
   
10.             // document.getElementById('videoPlay').play()
    
11.             // })     
    
12.             
    
13.             var voice = document.getElementById('videoPlay');
    
14.             if(typeof WeixinJSBrdgeReady=="object" && typeof WeixinJSBridge.invoke == "function"){
    
15.                 voice.play()
    
16.             }else{
    
17.                 if (document.addEventListener) {
    
18.                     document.addEventListener("WeixinJSBridgeReady", function () {
    
19.                         voice.play();
    
20.                     }, false);
    
21.                 } else if (document.attachEvent) {
    
22.                     document.attachEvent("WeixinJSBridgeReady", function () {
    
23.                         voice.play();
    
24.                     });
    
25.                     document.attachEvent("onWeixinJSBridgeReady", function () {
    
26.                         voice.play();
    
27.                     });
    
28.                 }
    
29.             }
    
30.     })

复制代码

再刷新，是不是微信就能够播放您网站视频了呢。