Я пытаюсь написать небольшое приложение, которое может записывать видео в браузере и загружать его на сервер.
У меня есть код ниже:
<html>
<body>
<video id="video" playsinline autoplay></video>
<script>
function hasGetUserMedia() {
return !!(navigator.mediaDevices &&
navigator.mediaDevices.getUserMedia);
}
if (hasGetUserMedia()) {
console.log("Good to go");
} else {
console.log('Not supported');
}
const constraints = {
video: true,
audio: true,
};
function start(){
navigator.mediaDevices.getUserMedia(constraints).
then((stream) => {video.srcObject = stream});
var videoEl = document.getElementById('video');
stream = videoEl.srcObject;
}
function stop(){
var videoEl = document.getElementById('video');
stream = videoEl.srcObject;
tracks = stream.getTracks();
tracks.forEach(function(track) {
track.stop();
});
downloadLink.href = URL.createObjectURL(new Blob(tracks[0]));
downloadLink.download = 'acetest.webm';
}
</script>
<button onclick="start()">Start</button>
<button onclick="stop()">Stop</button>
</body>
Я могу видеть видео на экране, но не знаю, как я могу записать его в файл для загрузки.
Я пытался использовать URL.createObjectURL(new Blob(tracks[0]));, но это не работает. Как сохранить видео после нажатия кнопки «Стоп»?