关于微信小程序的视频的坑

需求背景：最新在忙一个需求，就是小程序的课程详情的展现视频，以下图

---

video层级太高

在小程序的官方文档的话是有介绍的

目前解决的方案

• 使用【cover-view】【cover-image】标签能够覆盖到原生组件中。
• 视频方面的话是顶置在页面的最顶部，以视频层级为最高

video视频定位问题

详细说明：小程序的视频支持定位，可是在一部分手机上【不区分安卓和IOS】定位会形成视频底部黑底，以下图

目前的尝试过的方案：

• 视频展现的时候弹遮罩层，总体页面overflow: hidden;底部的遮罩层使用fixed定位，保证IOS弹性滑动的时候看不到底部的样式，
• 点击视频的时候跳转新的页面，在新的页面中展现视频，
• 网上还有一些关于视频定位问题的解决方案还未考究

视频关闭的时候会有声音

详细说明：一个页面使用图片点击的时候展现视频，捕获视频的缩放和回退的时候隐藏视频，可是一部分的安卓手机仍是能播放声音

目前不能解决、尝试的解决方案

• 等视频隐藏的时候，增长一个状态值，在watch的时候【ps：wepy框架为例】检测值的变化，手动触发暂停，或者中止，可是彷佛都没有理想的状态，仍是存在问题
• 经过状态值，清空video标签的src，可是会形成一部分手机加载不出视频的bug，初步认定是请求的延迟致使

其余可能遇到的问题
参考资料：

• http://www.wxapp-union.com/th...
• https://www.cnblogs.com/i-dou...

PS：关于小程序层级的问题，其实在爱奇艺、腾讯视频等小程序都是能实现的。但愿有人看到这篇文章的时候能给与更好的解决方案