Запись видео с помощью Edge с использованием HTML5 - PullRequest
Новая
       50

Запись видео с помощью Edge с использованием HTML5

0 голосов
/ 10 мая 2018

Я пытаюсь записать видео с использованием HTML5 API.Я хочу, чтобы это решение было кроссплатформенным, и оно должно работать как минимум в браузерах 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.
}

Пожалуйста, предложите, как я могу захватить байты, чтобы сохранить их на сервере.

Я пытался MediaStreamRecorder , но этотоже не работал с Edge.

Обновление : я нашел несколько подходов, которые указывают использование Canvas в качестве опции для рендеринга кадров и захвата байтов.Затем используйте requestAnimationFrame, чтобы продолжить захват видео.Хотя это может сработать, я все еще открыт для любых других лучших предложений.

1 Ответ

0 голосов
/ 16 мая 2018

MediaRecorder API, кажется, реализован только в FireFox и Chrome

https://caniuse.com/#search=MediaRecorder

Я бы всегда проверял на caniuse.com поддержку браузером новых API!

...