【搬砖百宝箱】如何在IOS设备上的H5上传.MP4格式视频

784 阅读1分钟

背景:

最近做一个社区网站,这个网站是支持三端(PC,Android,IOS)的,所以前端就做成H5,用原生的 webView 打开的方式。

问题描述:

产品新增了一个需求,要求用户可以在移动端通过富文本编辑器,进行文章的发表,并且支持上传视频。

富文本编辑器我选用的是vue-ckeditor2组件,它是基于CKEditor进行封装的,想必CKEditor大家有所耳闻,是个不错的编辑器,有丰富的功能插件。

视频上传使用的插件是html5video_v1,具体使用方法和上传方案后面会专门发表篇文章。一切都看起来辣么完美和顺利,直到在真机上测试时,IOS通过H5的<input>标签上传.MP4格式视频时,会自动转为.MOV格式,安卓端并没有转化的问题。Orz...

解决:

木得办法,拗不过强硬的原生系统,h5只能妥协。我们采取的解决方案是,上传.MOV视频后,由后端转码成.MP4格式,再有前端轮询查询后端转码是否完成的接口来判断是否转码完毕

局限:

如果文件过大时,转码时间就会变长。我们的产品是有要求视频不能过大的,所以此方案符合需求。 各位大佬还有啥其他好建议也可以跟我留言哦!