RecordRTC: интервальная загрузка на веб-сервер видеофайлов не может быть воспроизведена - PullRequest
0 голосов
/ 25 декабря 2018

Я хочу загружать записанное видео в каждое указанное время на веб-сервер.Код ниже загрузить видео на мой веб-сервер Django нормально.Первое загружаемое видео может быть воспроизведено, однако следующее видео не может быть воспроизведено.Есть идеи, почему это происходит?

Я также открыл проблему на Github несколько месяцев назад, но пока не смог найти решения.https://github.com/muaz-khan/RecordRTC/issues/438

setInterval(progressive_upload, 5000);
function progressive_upload(){
  var email = document.getElementById('user_id').value;
  var tempChunk;
  console.log(recordedChunks);
  if(count != 0){
    tempChunk = recordedChunks.slice(last_blob, recordedChunks.length);
    tempChunk.unshift(recordedChunks[0]);
    console.log(tempChunk);
  }
  else {
    tempChunk = recordedChunks.slice(0, recordedChunks.length);
    console.log(tempChunk);
  }
  last_blob = recordedChunks.length;
  count += 1;
  var blob = new Blob(tempChunk, {type: "video/webm"});
  var data = new FormData();
  data.append('data_blob', blob, email + '_' + count + '.' +  blob.type.split('/')[1]);
  var xhr = new XMLHttpRequest();
  xhr.open('POST', 'http://127.0.0.1:8000/video_upload/', true);
  xhr.send(data);
}

Почему все загрузки после первой не могут быть воспроизведены?

1 Ответ

0 голосов
/ 26 декабря 2018

Я получаю некоторые предложения от других и придумываю решение.Ниже приведен фрагмент моего кода.

setInterval(progressive_upload, 900000);
function progressive_upload(){
  var email = document.getElementById('user_id').value;
  theRecorder.stop();
  theStream.getTracks().forEach(track => { track.stop(); });
  count += 1;
  var blob = new Blob(recordedChunks, {type: "video/webm"});
  var data = new FormData();
  data.append('data_blob', blob, email + '_' + count + '.' + blob.type.split('/')[1]);
  var xhr = new XMLHttpRequest();
  xhr.open('POST', 'http://localhost:8000/video_upload/', true);
  xhr.send(data);
  navigator.mediaDevices.getUserMedia(constraints)
      .then(function(stream){
        theStream = stream;
        var video = document.querySelector('video');
        video.src = URL.createObjectURL(stream);
        try {
          recorder = new MediaRecorder(stream, {mimeType : "video/webm"});
        } catch (e) {
          console.error('Exception while creating MediaRecorder: ' + e);
          return;
        }
        recordedChunks = []
        theRecorder = recorder;
        recorder.ondataavailable = 
            (event) => {
              recordedChunks.push(event.data); 
          };
        recorder.start(100);
      })
      .catch(e => { console.error('getUserMedia() failed: ' + e); });
}

Надеюсь, это поможет другим в будущем.

...