最近接触到移动端播放视频，着实是头疼了比较长的时间。特此来记录一波，怀念下当初（非常难忘）的日子
首先先提醒小伙伴，h5其实是有自己的video播放的(这是最常规的用法)：
关于video的参数可以戳这了解下：https://blog.csdn.net/huang100qi/article/details/53405876
（这个视频源也是找的别人的，但是忘了地址了，在此多谢
）
<video preload='auto' src='https://www.seastart.tv/introduce.mp4' controls><p> 不支持video</p> </video>
这个就是controls默认的效果，正常来说是可以满足大多数需求（如果不是自定义控制播放、暂停，一定要加上controls,不然只会显示一张图片）。对了，如果只想留下默认的一部分控件，暂时就只能所有的控件都要自己去调API了（具体API可以参考上面的链接），controls目前是不可以让我们选择性的使用。
上面的截图也是我心里暗喜，这么简单就能实现。然而“现实”总是如此“多娇”
>>>>>>>>>>>>>>>>>>>>>难 忘 线>>>>>>>>>>>>>>>>>>>>>
在微信和qq中播放：
第一个问题：腾讯对非腾讯旗下的视频来源均强制全屏，结果就是视频画质模糊，长宽比例失调（截图太大，就不放了，有兴趣可以试试）
第二个问题：播放完成后，是一个腾讯视频新闻的列表页（对于想展示自家东西的小伙伴，是一件很~~de事，对于用户来说，体验也是很醉人）
所以产品大哥不乐意了（在这致敬所有的产品大哥
）：你能不能让它在当前页面播放，全屏画面都糊了，用户怎么看~~
然后就开始了各种找法子的艰辛历程……
<video preload='auto' id='my-video'
src='https://www.seastart.tv/introduce.mp4'
webkit-playsinline='true' /*这个属性是ios 10中设置可以,让视频在小窗内播放，也就是不是全屏播放*/
playsinline='true' /*ios微信浏览器支持小窗播放*/
'x-webkit-airplay='allow'
x5-video-player-type='h5' /*启用同城播放器*/
x5-video-player-fullscreen='true' /*全屏设置，设置为true是防止全屏*/
x5-video-ignore-metadata='true'
width='100%' height='100%' controls><p> 不支持video</p> </video>
这样设置完了，其实和别的第三方平台还是有差异的，就是不能在当前页播放，还是会在另一个页面居中播放，但是相比之前的全屏以及广告，产品已经打算放过楼主了。
对了，提一句，看到网上说有用canvas做播放的，楼主试了下，对于页面只有一个视频而言，还是可以试试。但是有多个视频的页面以及有滚动的页面，就很尴尬了，毕竟canvas做出来的页面时不能动的，会很尴尬~
好了，就先记录到这里，以后自己来看应该还会怀念吧……哈哈哈 $_$ $_$