Cordova开发app——短视频拍摄

发表于 阅读次数：

我现在所做的项目是一个客服系统（类似类似阿里旺旺吧？），之前产品的聊天功能就只是发送文字、图片和一些emoji表情，现在需要在项目中添加发送语音和15秒的短视频（限制时长的视频，不一定要15秒）

前一篇文章写了发送语音的功能，这片文章写一下录制短视频的功能。

我现在所做的项目是一个客服系统（类似类似阿里旺旺吧？），之前产品的聊天功能就只是发送文字、图片和一些emoji表情，现在需要在项目中添加发送语音和15秒的短视频（限制时长的视频，不一定要15秒）

如果我们用 让用户选择设备上已经录好的视频进行上传的方式进行发送其实也是可以的，但是我们就不好控制视频的时长了，视频时间太长文件也必然很大，会占用很多的空间，所以我们选择了让用户在我们自己app中进行录制的方案，这样就可以根据控制视频时间的长度，来把视频的大小控制在较小的范围内。

本文主要用到的插件是：cordova-plugin-media-capture

插件GitHub地址：cordova-plugin-media-capture

该插件既可以录音也可以录制视频，但是在安卓手机上，录音的时候会打开手机自带的录音机APP进行录音，感觉体验不是很好，所以我只用了该插件录视频的功能。

简单使用

安装：
1
cordova plugin add cordova-plugin-media-capture
需要在deviceReady后进行方法调用
1
2
3
4
document.addEventListener("deviceready", onDeviceReady, false);
function onDeviceReady() {
    console.log(navigator.device.capture);
}
使用：
1
2
3
4
5
6
7
8
9
10
navigator.device.capture.captureVideo(
    this.videoSuccess,// 视频录制成功后的处理
    this.videoError, // 视频录制失败后的处理
    {
        duration: 15,// 限制录制的视频时间长度，单位：/秒
        limit:1 // 非必填，不写此项时，默认为1
        // 在ios一次只能录一个视频，
        //在Android上，连续录制视频的个数受limit的限制
    }
);

视频上传插件和前一篇文章用的一样，方法就不在介绍了

上传插件的简单使用可以看我的上一篇文章：Cordova开发app，使用插件录音并上传服务器

需要注意下！！

在Android上录制的视频是mp4格式的，在其他设备上能很好的播放，但是在ios上，录制的视频是mov格式的，所以需要做转码处理后才能在其他设备上播放（可以前端处理，也可以上传到服务器后在后端处理，）

转码后又一个问题需注意：

不是所有的mp4格式在ios设备上都能正常播放！！！

之前转码的mp4在安卓上正常播放，但是在ios上，播放的视频没有声音！！！

网上搜了下，说是音轨问题，

百度说：iphone自带播放器只识别AAC的音频，所以视频转换MP4，编码方式选择H264+AAC或 MPEG4+AAC就行了。

所以转码的时候需要注意，目前我们项目因为是在服务端转码的，所有后端正在处理这个问题～

这就是文章的全部内容了，感谢阅读！
欢迎留言探讨～