微信webview中的video

[xiaosong]

微信webview中的video

微信webview中设置video的currentTime

video的currentTime在播放后才能进行设置，可以通过下面的方法初始化播放时间

$(player).one('playing', function(){
  setTimeout(function(){
    player.currentTime = parseInt(_t.opts.current_time, 10);
  }, 1000);
});

这里的1秒钟延时是个经验值，实测100毫秒是不够的，1秒就可以，临界值未测试。

微信webview中video非全屏播放

在微信webview中，video默认自动全屏进行播放，对于苹果手机，为video标签设置webkit-playsinline=""属性可以达到非全屏播放的效果，但是在android手机上，这种方式只能保证在退出全屏后再次点击播放时可以非全屏播放。

2016-12-14更新：

最新版本中，对于苹果手机，为video标签设置webkit-playsinline=""属性只能保证在退出全屏后再次点击播放时可以非全屏播放，而安卓手机上已经没有办法非全屏播放。

2016-12-17更新：

webkit-playsinline="true" playsinline="true"

通过上述代码可以达到苹果手机非全屏播放的效果，安卓上退出全屏后也可以通过底部的播放按钮非全屏播放

微信webview中遮盖video

在安卓的微信webview中，video无法被div遮盖住，使用display样式将vidoe隐藏后播放会暂停

1. 尝试使用visbility样式将video隐藏起来，实际验证没有效果

2. 尝试使用iframe进行遮盖，实际验证也无法达到要求

iphone的微信webview中video可以被遮盖住，遮盖时视频继续播放。

2017-04-14更新：

经过测试，只有部分安卓手机video无法被div遮盖

微信webview中video自动播放

在微信webview中，video标签的autoplay属性无法生效。
对于苹果手机，可以通过下面的方式解决此问题

var player = document.getElementById('player');
player.play();
player.pause();
player.play();

但是在android手机上，此问题无法完全规避，android手机上，用户如果点击后立即调用上面的代码可以直接进行播放，但是如果在ajax回调中调用则无法达到自动播放的目的。

2016-12-14更新：

最新版本中，苹果手机的效果与安卓上一致，怀疑与video是通过js append导致的，验证后再更新。
与video通过js append无关

2016-12-30更新：

在安卓和苹果上用户点击之后立即调用video元素的load和play可以开始播放，对于同一个video元素，如果已经load或者play过，再在js中调用play方法就可以自动播放。
基于上面的结论，对于单页应用，可以在用户点击后将video的src设置为空，再调用load方法，在需要自动播放的页面，将之前load过的video元素插入到需要播放的地方，可以实现自动播放。

2017-04-14更新：

iOS 10 Safari 允许自动播放以下两种视频：
无音轨视频；
无声音视频（设置了 muted 属性）；
iOS 10 Safari 视频播放新政策