android上视频播放存在的问题
在PC上播放html5视频,设置video.currentTime=5,视频将跳到5s的位置,并且显示出第5s的画面。在安卓下,却存在下面两个问题:
- 在安卓上,为了省电,在暂停的时候,改变视频属性不会刷新画面,直到你再次播放的时候,这些改变才会表现出来。所以暂停的时候改变currentTime不会更新画面,手动改变进度条也不行。
- 在安卓上,视频并不是准确的按currentTime播放,可能你设置 currentTime = 5,但是播放出来的内容却是第8s的。这个问题,用手改变进度条也会出现,可以将视频拖到60s,在拖回10s,看看播放的内容是否是第10s的。
所以,对于一些需要精确控制视频进度的情景,比如视频演示,这两个问题会造成很大的困扰,因为android下,没有办法很精确的控制视频进度。
可能并不是所有移动端都存在这两个问题,没验证哪些存在
解决办法
对于第二个问题,是没有办法改变的,这是html5 video的实现问题。但是第一个问题,却可以通过模拟“暂停下设置视频进度”解决。
模拟的方式是,先播放视频,然后将视频设置到目标时间,当视频加载出第一帧的时候,暂停视频,如下:
播放视频,监听playing事件
触发playing事件,说明视频已经开始播放,此时设置currentTime等于目标时间,监听seeked事件
触发seeked事件,在移动端下,seeked事件触发后,表示已经寻址到了指定时间,但是画面还没更新,监听timeupdate事件
触发timeupdate事件,在移动端下,第一次触发这个事件表示即将更新画面,此时设置50ms的延迟,因为一般视频为24fps,也就是40ms刷新一帧,50ms的延迟为了确保第一帧加载出来
延迟结束,暂停视频。此时视频暂