18 March 2020

最近项目中遇到这种需求:要求用户在手机端HTML5拍摄视频并上传,后台管理员读取视频进行审核。由于之前没有处理过视频相关内容,遇到了不少坑。

视频分片上传

由于用户拍摄30到40秒视频,目前的手机摄像头太给力,这么长时间的视频不经处理的话大概100多MB。由于使用HTML5上传视频,没有找到好的压缩方案(有做过的同学可以指点下)。直接将100多MB的视频上传耗时较长。所以打算采用下面方案:

  • 视频在前端以base64编码分段上传,
  • 上传过程中根据视频总长度和已上传数计算上传进度并显示上传进度条来缓解用户长时间上传焦虑问题。
  • 后台将base64编码拼接后再转会mp4视频。

base64转mp4

正常情况下base64转mp4很简单,java 提供了基本的api。但是这里转换过程需要有几点需要注意:

  • base64编码的视频包含有头信息比,直接转mp4后我在后台html5中无法播放。因此需要去掉头信息。
  • 不同平台的头信息是不一样的,比如android是:data:video/mp4 ios平台是: data:video/quicktime

视频压缩处理

视频虽然成功上传到后台了,但是后台审核人员读取并审核视频的时候遇到了些问题:视频太大,加载太慢。 可以从以下两方面解决:

  • 由于对视频精度要求不高,所以可以对视频进行压缩
  • 视频向页面输出的时候可以考虑采用流式传输的方式进行下载,做到一遍下载一边播放,而不用等到全部下载完毕才播放。

针对视频进行压缩可以采用ffmpeg,可以通过java直接调用ffmpeg组件来压缩,也可以使用一个封装好的java库:jave,改库内置了ffmpeg。使用的过程中主语视频压缩的时候设置编码为H.264,否则,压缩的视频文件无法在网页播放,因为网页只支持H.264编码的视频播放。





blog comments powered by Disqus
Fork me on GitHub