mxmod
Новичок
Здравствуйте, я реализовал сохранение записи на сервер с веб-камеры по нажатию кнопки(окончание записи). Я не знаю как сделать, чтобы поток видео передавался в реальном времени, т.е к примеру если закрыть окно браузера или непредвиденно прервётся запись, то на сервере всё равно создастся запись, что успело туда передаться.
JavaScript:
navigator.mediaDevices.getUserMedia({video:true, audio:true}).then((stream)=>{
video.srcObject=stream;
video.play();
console.log(stream);
let mediaRecorder=new MediaRecorder(stream);
console.log(mediaRecorder);
document.querySelector("#start").addEventListener("click", function(){
mediaRecorder.start()
});
let videoChunk=[];
mediaRecorder.addEventListener("dataavailable",function(event){
videoChunk.push(event.data)
let videoBlob=new Blob(videoChunk, {type:"video/mp4"});
});
mediaRecorder.addEventListener("stop",function(){
videoBlob=new Blob(videoChunk, {type:"video/mp4"});
console.log(videoBlob)
let videoURL=URL.createObjectURL(videoBlob);
console.log(videoURL);
let video2 = document.createElement('video');
video2.src = videoURL;
video2.controls = true;
video2.autoplay = false;
document.querySelector("#video2").appendChild(video2);
document.querySelector("#save").href=videoURL;
document.querySelector("#save").download="record.mp4";
console.log(videoChunk);
let fd=new FormData();
fd.append("voice", videoBlob);
var xhr = new XMLHttpRequest();
xhr.open('POST', 'index2.php', true);
xhr.onload = function(e) {
console.log('Sent');
};
xhr.send(fd);
xhr.onreadystatechange=function() {
if (this.readyState==4 && this.status==200) {
console.log(this.response);
}
}
videoChunk = [];
});
document.querySelector("#stop").addEventListener('click', function(){
mediaRecorder.stop();
});
});
PHP:
<?php
$upload="files/video.mp4";
move_uploaded_file($_FILES["voice"]["tmp_name"], $upload);
?>
