解决安卓微信video标签标签劫持

解决安卓微信video标签标签劫持

需求

期望网页中的video标签,不在安卓微信中被劫持播放。

代码

可能视频地址失效,换个视频地址,再测试。


<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Titletitle>
head>
<body>
<div>
    hello test
div>
<video id="h" src="http://cdn1.h5mugeda.com/c/uj_g/q1ob/videos/5c7f848decb65e22376710c3.mp4" playsinline=""  x-webkit-airplay="" webkit-playsinline="" x5-playsinline preload="auto"  style="width: 100%;">video>


<script src="http://res.wx.qq.com/open/js/jweixin-1.0.0.js">script>
<script>

    // IOS  webkit-playsinline="true" playsinline="true"
    // 安卓  x5-playsinline="" 且 需要执行 play() 方法

    //--创建页面监听,等待微信端页面加载完毕 触发音频播放
    document.addEventListener('DOMContentLoaded', function () {
        function audioAutoPlay() {
            var audio = document.getElementById('h');
            audio.play();
            document.addEventListener("WeixinJSBridgeReady", function () {
                audio.play();
            }, false);
        }
        audioAutoPlay();
    });
    //--创建触摸监听,当浏览器打开页面时,触摸屏幕触发事件,进行音频播放
    document.addEventListener('touchstart', function () {
        function audioAutoPlay() {
            var audio = document.getElementById('h');
            audio.play();
        }

        audioAutoPlay();
    });
script>
body>
html>

你可能感兴趣的:(js)