Firefox：drawImage（video）失败，出现NS_ERROR_NOT_AVAILABLE：组件不可用

Question

尝试使用来源为网络摄像头源的drawImage调用video似乎在Firefox中失败，NS_ERROR_NOT_AVAILABLE: Component is not available。

我已尝试等待视频代码触发的每个事件：play，playing，canplay，loadeddata，loadedmetadata等，但没有任何效果。这似乎是因为在将流正确加载到<video>元素之前触发了这些事件。

JSFiddle with error（您可以在控制台中查看错误）

副作用是视频的宽度和高度也不正确。

Answer 1

这是Firefox中的bug。最简单的解决方法是继续尝试直到错误消失，因为没有事件在正确的时间触发。

参见：http://jsfiddle.net/9aT63/25/

基本上，您必须将drawImage调用包装在try / catch块中。

function drawVideo() {
  try {
    $vidCanvasCtx.drawImage($vid, 0, 0, $vidCanvas.width, $vidCanvas.height);
    ...
  } catch (e) {
    if (e.name == "NS_ERROR_NOT_AVAILABLE") {
      // Wait a bit before trying again; you may wish to change the
      // length of this delay.
      setTimeout(drawVideo, 100);
    } else {
      throw e;
    }
  }
}