Javascript WebRTC减少录制视频的大小

我用这个例子在（Firefox/Chrome）中录制了10秒的视频。记录了大约[10秒，4.36MB（320x240）]的blob大小，然后我将一些参数修改为fallows

var videoConstraints = {
    audio: false,
    video: {
        mandatory: {
            width: { min: 320 },
            height: { min: 240 }
        },
        optional: [
            { width: 320 },
            { width: 
                { min: 320 }
            },
            { frameRate: 60 },
            { quality: 10 },
            { width: 
                { max: 320 }
            },
            { facingMode: "user" }
        ]
    }
};

---

但水滴的大小几乎是一样的。我能做些什么，以减少记录的blob大小。

您的约束混合了特定于Chrome的格式和标准，并且在没有浏览器的情况下也能工作

该标准（仍然需要镀铬的polyfill）：

标准也一样，因此这是相同/更好的：

var constraints = {
  video: {
    width: { min: 320, ideal: 320 },
    height: { min: 240 },
    frameRate: 60,
    facingMode: "user",
  }
};

最后，如果要减小尺寸，请不要使用

min

min

和

max

是边界，因此

min

不会给出低分辨率，相反，它设置了一个下限。相反，使用

ideal

表示重力，甚至

max

我不会解释这在Chrome中会是什么样子，因为它使用了一种过时的语法，在其他浏览器中不起作用，但在使用polyfill的浏览器中可以工作：

var约束={
视频：{
宽度：{min:320，理想值：320}，
高度：{min:240}，
帧率：60，
facingMode:“用户”，
}
};
函数start（）{
navigator.mediaDevices.getUserMedia（约束）
.then（函数（流）{v.srcObject=stream；}）
.然后（函数（）{
返回新承诺（函数（r）{v.onloadedmetadata=r；}）；
})
.然后（函数（）{
日志（“成功：+v.videoWidth+“x”+v.videoHeight）；
})
.捕获（失败）；
}
函数日志（msg）{div.innerHTML+=“”+msg+“
”；}
函数失败（e）{log（e+”，行“+e.lineNumber）；}

开始

@jib的回答将降低捕获的分辨率/帧率。然而，blob大小不变的原因是您需要降低MediaRecorder的编码比特率。然而，还没有浏览器对MediaRecorder实施比特率限制（Firefox计划很快这样做——Firefox最初的实现是支持Firefox操作系统摄像头中的视频录制，并以固定比特率运行）。

不确定为什么snippet在Chrome中无法工作。我在工作。

var constraints = {
  video: {
    width: { min: 320, ideal: 320 },
    height: { min: 240 },
    frameRate: 60,
    facingMode: "user",
  }
};