Question

我正在创建一个基于网络的移动应用，可以上传视频录像。有两种方法可以实现这一目标：

使用输入：

<input type="file" name="video" accept="video/*" capture></input>

使用RTC MediaRecorder：

var recordedBlobs = [];
function handleDataAvailable(event) {
    if (event.data && event.data.size > 0) {
        recordedBlobs.push(event.data);
    }
}

var options = {
    mimeType: 'video/webm',
    audioBitsPerSecond : 128000,
    videoBitsPerSecond : 2500000
}

mediaRecorder = new MediaRecorder(window.stream, options);
mediaRecorder.ondataavailable = handleDataAvailable;
mediaRecorder.start(10);

虽然第一个选项始终有效，但主要问题是它使用内置移动相机应用程序让我们无法控制质量，这又导致可能非常大的文件（特别是在Android上）

第二个版本使我们能够完全控制质量，并允许操作系统创建适度的文件大小，这些大小在应用程序中作为内容可接受。 iOS / Safari尚不支持此功能，但这是可以的，因为从浏览器启动时，默认情况下iPhone会记录小文件。因此，当用户代理是iOS时，我可以激活选项1。

现在出现问题：

如果可以的话，第一个选项会没问题：

控制移动应用程序的视频录制质量
在上传前详细说明录制内容以更改分辨率

选项2的问题是仅支持.webm容器类型，并且Safari不支持此类型。

所以我有点卡住了 - 现在看起来我唯一的选择就是将上传的.webm文件后转换到服务器上的.mp4文件。但它似乎是服务器上一个非常耗费CPU的过程。

有什么好主意吗？

Answer 1

您可以将H.264录制到webm容器中。 Chrome支持此功能。

var options = {mimeType: 'video/webm;codecs=h264'};

media_recorder = new MediaRecorder(stream, options);

虽然它是视频格式和容器的通常组合 - 但它是有效的。

现在，您可以将H.264 / webm更改为H.264 / mp4，而无需使用ffmepg（-vcodec copy）对视频流进行转码。

你也可以尝试使用ffmpeg.js在JavaScript中从webm重新包装到mp4客户端。

HTML5录制适中的视频质量，可供Safari上传

1 个答案: