去除屏蔽 安卓Android手机的 qq浏览器 微信H5使用video标签播放视频,结束后的视频广告

    技术2022-07-20  83

    今天是个好日子  老干妈炖大鹅的好日子  

    X5内核是腾讯基于优秀开源Webkit深度“优化并加工”的浏览器渲染引擎   微信和手机qq都是  还有一些就不细说了

    x5内核会监管video标签播放的视频 无论是暂停或结束都会推送一些广告 且是最高级  所以 通过JS或Video标签控制播放暂停  没啥用   

    网上找了 看了 也试了 几种方式

    一 自动循环播放  手动关  看不见等于没有 

    (微信和许多浏览器都不让自动播放  须先触发事件  即便循环几遍 也会强制结束 依旧弹广告    放弃吧 没用的 ) 

    二 js监视视频播放结束后,先执行播放视频的方法,再暂停视频

    let isiOS = !!navigator.userAgent.match(/\(i[^;]+;( U;)? CPU.+Mac OS X/) let videoContext = document.getElementById('video'); videoContext.addEventListener('ended', () => { if (!isiOS) { videoContext.play(); setTimeout(() => { videoContext.pause(); }, 100) } })

     

    微信监控video是在最底层  意味着优先级最高  这一次不弹 下次还会再来   不够完美

    三  打败不了那就加入吧  使用x5内核的一些属性  默认启用x5内核  使用浏览器自带的播发器  广告就没了

    <video id="video" preload="auto" autoplay playsinline="true" webkit-playsinline="true" x5-playsinline="true" x-webkit-airplay="allow" v-bind:src="video_file" :poster="ImgUrl" class="avatar video-avatar" x5-video-player-type="h5" x5-video-player-fullscreen="true" x5-video-orientation="landscape|portrait" controls="controls" controlslist="nodownload noremoteplayback" >您的浏览器不支持视频播放</video>

    autoplay: 自动播放 preload="auto" - 当页面加载后载入整个视频 x5-video-player-type="h5" :  启用x5内核H5播放器

    playsinline="true" 内联播放

    webkit-playsinline="true"

     x5-playsinline="true"

    x5-video-player-fullscreen="true"  全屏设置。ture和false的设置会导致布局上的不一样 x5-video-orientation="landscape|portrait" :声明播放器支持的方向,可选值landscape 横屏,portraint竖屏。

     开启x5内核H5播放器   广告消失了

    猜测 : 广告的弹出机制 是针对于 除x5外  其他的一些播放器主要是video  默认启用也就可以了

     

     

     
    Processed: 0.015, SQL: 9