video标签poster属性在安卓微信中不生效问题解决

最近在开发一个视频模块时，遇到不少的坑，因为video在目前移动端兼容性存在不少问题。

问题：安卓手机在微信端poster属性不生效，图片不显示，显示黑屏。

预期效果是视频未播放时，展示预设的图片，通过video的poster属性设置，测试发现在安卓微信X5内核浏览器，图片无法显示，代码如下：

<video :poster="videoObj.imageUrl" id="video" controls>
　　<source :src="videoObj.videoUrl" type="video/mp4">当前浏览器不能支持视频播放，请采用chrome或IE9以上浏览器 
 </video>

项目是vue项目，videoObj.imageUrl与videoObj.videoUrl分别是图片和视频链接。后通过一番资料搜索后，针对安卓微信X5内核，通过设置属性

x5-video-player-type="h5" 进行兼容处理。如下：

<video :poster="videoObj.imageUrl" id="video" controls x5-video-player-type="h5">
　　<source :src="videoObj.videoUrl" type="video/mp4">当前浏览器不能支持视频播放，请采用chrome或IE9以上浏览器 
</video>

转载于:https://www.cnblogs.com/shichangchun/p/9848332.html