使用HTML5使用Edge进行视频录制

我正在尝试使用HTML5API录制视频。我希望这个解决方案是跨平台的，它至少可以在Chrome、Firefox和Edge浏览器上运行。我尝试了以下代码

navigator.mediaDevices.getUserMedia({
  audio: true,
  video: true
}).then((mediaStream) => {

  const video = document.querySelector('video');
  const url = window.URL.createObjectURL(mediaStream);
  video.src = url;
});

以上代码以Chrome和Edge显示视频。当我尝试使用MediaRecorder API捕获字节时，它只在Chrome中起作用，而在Edge中不起作用。请建议可以做什么

const recorder = new MediaRecorder(mediaStream);
recorder.ondataavailable = onDataAvailable
...
function onDataAvailable(d){
   //d.data is populated in Chrome but not in Edge.
}

请建议，我如何捕获字节以便将其保存在服务器上

我试过了，但这对Edge也不起作用

---

更新：我发现很少有方法表明使用画布作为渲染帧和捕获字节的选项。然后使用requestAnimationFrame继续捕获视频。虽然这可能有效，但我仍然愿意接受其他更好的建议。

MediaRecorder API似乎只在FireFox和Chrome中实现

---

我总是在caniuse.com上查看新API的浏览器支持

嗨，Zouhir，谢谢你的回复。但它没有回答我的问题。我了解caniuse网站。我要寻找的是Edge中可靠的视频录制方式。因此，首先不要将

URL.createObjectURL

与MediaStream一起使用，而是将MediaElement的

srcObject

直接设置为MediaStream。现在，Edge不支持MediaRecorder API（尽管如此），因此它是不可行的。唯一的方法是在画布上绘制视频帧，将每个帧导出为独立图像，使用Web音频API提取音频曲目的原始PCM数据，最后以视频格式重新打包所有内容。我不相信这是可以实时完成的，而且对你来说，开发这个可能要比等待IE实现这个API花费更长的时间。你运气好吗？我目前自己也遇到了这个问题，但在如何解决这个问题上并没有取得多大进展（我甚至不在乎它是否是一个特定于边缘的实现）。嗨@Peter Mellet，我无法为边缘找到可靠的解决方案。有人建议使用ORTC或webRTC作为边缘浏览器，并使用kurento等媒体服务器记录流。虽然我可以录制视频，但由于带宽可变，视频质量是个大问题。