TypeError，captureStream 不是函数

Question

我创建了一个带有视频元素的 HTML5 页面。播放示例视频。在我尝试在视频元素中记录流之后。我正在使用 RecordRTC 库来实现录制功能。我有以下代码

var stream = document.getElementById("my_video").captureStream();
var recorder = RecordRTC(stream, { 
  type: 'video'
});

recorder.startRecording();

录制在 Chrome 浏览器和 Mozilla 浏览器上成功运行，直到版本 57。但在去年 1 月，Mozilla 浏览器更新到版本 58。此更新后，尝试使用 Mozilla 录制视频时出现错误。

错误信息是：

TypeError 
message: document.getElementById("my_video").captureStream is not a function"

如何解决这个问题？

Answer 1

好吧，根据文档，这是实验性技术，因此 Firefox 要求您moz在函数名称前加上前缀：mozCaptureStream. 我有点惊讶它以前完全有效。

您可以使用 来检查浏览器版本navigator.userAgent。

const sUsrAg = navigator.userAgent;

if (sUsrAg.indexOf('Firefox') > -1) {
  console.log('Firefox');
  document.getElementById("my_video").mozCaptureStream();
} else {
  console.log('Other');
  document.getElementById("my_video").captureStream();
}

<video id="my_video"></video>