Firefox: drawImage(видео) завершается неудачно с NS_ERROR_NOT_AVAILABLE: компонент недоступен

Question

Пытаюсь позвонить drawImage с video чей источник - веб-канал, кажется, терпит неудачу в Firefox сNS_ERROR_NOT_AVAILABLE: Component is not available,

Я пытался дождаться каждого события, которое запускает тег видео: play, playing, canplay, loadeddata, loadedmetadataи так далее, и ничего не работает. Это происходит потому, что эти события запускаются до того, как поток будет загружен в <video> элемент.

JSFiddle с ошибкой (Вы можете просмотреть ошибку в консоли)

Побочным эффектом является то, что ширина и высота видео также неверны.

Answer 1

Это ошибка в Firefox. Самое простое решение - просто продолжать попытки, пока ошибка не исчезнет, ​​так как ни одно событие не запускается в нужное время.

Смотрите: 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;
    }
  }
}