手机端h5视频播放踩的一些坑

最近在开发手机h5视频播放器嵌app里，在网上看到一些h5的插件，如video.js,zyMedia...,

个人觉得如果在移动端用的话，没多大必要用这些插件，直接用h5提供的标签就可以了，

官方也提供了很多关于播放器的接口方法。

说一下我遇到的坑吧，由于项目是一个试水的项目，所以公司决定先用MP4格式的视频，

视频是视频提供商提供的，刚开始他们提供了一个视频大小240M，由于网络，带宽一些问题，

在手机上测试出现很多问题，最明显的就是当视频播放到22秒的时候，就跟不上了，出现加载中状态，

并且是一直这个状态，后来给出的解决方法是压缩视频，提供商给我们压缩到40几M，画质还不错480P，

但是又出现新的问题，视频在一些安卓手机上加载不出来，有一些是声音出来，图像出不来，后来经过

研究发现，HTML5支持的视频MP4格式是要求H.264编码的，其他编码的会出现问题，后来通过格式转换

成H.264编码的MP4格式视频，经测试所有机子都OK了

再补充一点，h5头要加上

<meta name="viewport" content="initial-scale=1.0, maximum-scale=1, user-scalable=no,width=device-width,height=device-height"/>

，由于之前没有加上
maximum-scale=1, user-scalable=no这两个，导致视频全屏播放回去的时候，页面结构被破坏，页面被撑大