HTML5记录适中的视频质量，可供Safari浏览器上传

我正在创建一个基于Web的移动应用程序，应该可以上传视频录像。有两种方法来实现这一目标：HTML5记录适中的视频质量，可供Safari浏览器上传

使用输入：

<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目前还不支持此功能，但这样做没有问题，因为从浏览器启动时，iPhones默认记录小文件。所以我可以在用户代理是iOS时激活选项1。

现在的问题：

第一个选择，如果我可以罚款：

控制移动应用程序的视频录制质量
后阐述的记录来改变上传面前的决议

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

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

任何好主意？

来源

2017-08-18 Jakob Simon-Gaarde

如果要进行后期处理，您必须将'.webm'文件存储在客户端或服务器上，并将其转换为'.mp4'文件。在服务器端，你可以用FFMpeg来完成。在客户端，您可以使用开源库进行转换。 –

我可以说，我一直在使用服务器端的ffmpeg将webm转换为mp4。我甚至做了一个很好的脚本，可以显示进度的百分比。但转换既耗时又耗CPU。我想做一个ffmpeg -c副本，从而省略重新编码。但不幸的是，这对于webm容器来说是不可能的。如果我可以运行一个ffmpeg命令，它可以在不重新编码的情况下进行转换，那么这就是解决方案。 –

*“如果我可以运行一个ffmpeg命令，可以转换而不需要重新编码”* - 不可能。如果不进行重新编码，您无法将一种格式转换为另一种格式，.webm和.mp4会有很大不同。 –

您可以将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客户端。

来源

2017-08-26 21:27:08

我刚刚在视频/ webm; codecs = h264录制的feed上尝试了-vcodec副本。我跑这个命令： 'ffmpeg的test.webm -vcodec副本test.mp4' 得到了以下错误：输出文件＃0中不包含任何流 –

如果我能做的非转码格式的变化，那么它是肯定是我需要的解决方案。 –

我忘记了'-i'的人:-D –

HTML5记录适中的视频质量，可供Safari浏览器上传

回答

相关问题