大家做H5页面的时候想必都会遇到过一个问题,那就是使用video标签的时候在移动端或者微信上会默认弹出外置的播放器,使很多特效页面无法完成。但是别人的页面却可以,比如著名的薛之谦的页面:http://game.qq.com/act/a20161121xzq/?ADTAG=tencent.h5
这是什么原因呢?懂的人都知道,这是腾讯的白名单,白名单内的地址可以使用内置的播放器进行播放,可惜现在腾讯已经关闭了白名单的申请,值得注意的是ios并不影响(ios只需要设置webkit-playsinline="true"),影响的主要是安卓。那怎么才能在安卓下也能播放呢?好在微信的X5内核经过了几代版本迭代,推出了x5-video-player-type="h5" 和 x5-video-player-fullscreen="true"属性,这个可以让网页在所谓“同层播放器”中播放,可以解决安卓播放视频弹出默认框的问题。
接下来,我放出一个demo:http://www.ajexoop.com/test/embedVideoTest/test.html
(我的服务器网速只有100k,测试视频有2m,所以大家看demo的时候耐心等等)