移动端H5视频页面部分体检兼容问题

视频页面部分体检兼容问题:
H5的技术已整体趋于成熟,但在视频播放方面,如果跟PC端的Flashplayer对比的话,功能就显的非常简单了。如果要让视频支持在手机端(主要是iPhone)播放的话,需要了解下面这些内容。
1:视频格式必需是mp4的,iphone不支持flv,如果是Hls视频,格式应该是m3u8,不支持rtmp协议的播放;
2:H5不能把多个mp4合并成一个视频播放(像ckplayer在PC端的那样),导致多个视频来回切换体验不佳;
3:H5的API总体来说还是够用的,比如用js控制播放器的播放/暂停之类的。但复杂的操作就不支持了;
4:H5的自动播放并不是所有的平台都支持,在有些环境(手机),即使你设置了视频自动播放,环境也不允许该命令执行,必需经过用户点击才能播放。
5:H5在有些环境中(手机)必需点击全屏按钮才会触发视频播放;
总体说来,就是不同的平台(系统类型和浏览器类型)对H5并没有一个统一的标准。所以可能出现不同的问题,视频兼容要在多个不同型号手机测试;
6:一些机型播放视频脱离文本流,不能在H5页面播放视频(会导致H5事件触发不生效),系统会自动接管视频;IOS设备可以强制不调用系统内置播放器,安卓的一些机型强制不脱离文本流的方式无法生效;
7:视频页面加载之后页面空白,无缩略效果(移动端H5视频的诟病),需要增加一张视频未播放之前覆盖到之上的视频缩略图;
8:以上各点会造成移动端H5视频页面(仿抖音效果)体验不佳,甚至会引起页面卡死;
9:建议视频H5页面 => App原生页面;
Android 效果
型号:小米5S

播放前

播放中调起系统内置播放器

播放前页面无缩略效果,白屏

切换时视频区域消失

切换时视频区域消失

IOS效果:
IOS效果较好;
» 本文来自:前端开发者 » 《移动端H5视频页面部分体检兼容问题》
» 本文链接地址:https://www.rokub.com/42508.html
» 您也可以订阅本站:https://www.rokub.com
赞(0)
64K

评论 抢沙发

评论前必须登录!