如何将getusermedia（）获取的b​​lob发送到socket.io，然后将其发送回客户端并将其放入视频元素中

Question

这是代码：

 var mediaSource = new MediaSource();
 mediaSource.addEventListener('sourceopen', handleSourceOpen, false);
 var mediaRecorder;
 var recordedBlobs;
 var sourceBuffer;
 var socket = io();
 var recordedVideo = document.querySelector('video#recorded');
 var gumVideo = document.querySelector('video#gum');
 var translateButton = document.querySelector('button#record');

 translateButton.onclick = startTranslate;
 recordedVideo.src = window.URL.createObjectURL(mediaSource);

 socket.on('video', function (data) {
   sourceBuffer.appendBuffer(data);
 });

 navigator.mediaDevices.getUserMedia(constraints)
 .then(handleSuccess).catc(handleError);

 function handleSourceOpen(event) {
      console.log('MediaSource opened');
      sourceBuffer = mediaSource.addSourceBuffer('video/webm; codecs="vp8"');
      sourceBuffer.onupdate = function(){
        console.log("updating");
      };
      console.log('Source buffer: ', sourceBuffer);
 }

 function handleSuccess(stream) {
     console.log('getUserMedia() got stream: ', stream);
     window.stream = stream;
     if (window.URL) {
       gumVideo.src = window.URL.createObjectURL(stream);
     } else {
       gumVideo.src = stream;
     }
 }

 function startTranslate() {
     recordedBlobs = [];
     var options = {mimeType: 'video/webm;codecs=vp9'};
     if (!MediaRecorder.isTypeSupported(options.mimeType)) {
       console.log(options.mimeType + ' is not Supported');
       options = {mimeType: 'video/webm;codecs=vp8'};
       if (!MediaRecorder.isTypeSupported(options.mimeType)) {
         console.log(options.mimeType + ' is not Supported');
         options = {mimeType: 'video/webm'};
         if (!MediaRecorder.isTypeSupported(options.mimeType)) {
           console.log(options.mimeType + ' is not Supported');
           options = {mimeType: ''};
         }
       }
     }
     try {
       mediaRecorder = new MediaRecorder(window.stream, options);
     } 
     catch (e) {
       console.error('Exception while creating MediaRecorder: ' + e);
       alert('Exception while creating MediaRecorder: '+ e +'.mimeType: ' + options.mimeType);
       return;
     }
     console.log('Created MediaRecorder', mediaRecorder, 'with options', options);
     recordButton.textContent = 'Stop Recording';
     playButton.disabled = true;
     downloadButton.disabled = true;
     mediaRecorder.onstop = handleStop;
     mediaRecorder.ondataavailable = handleDataAvailable;
     mediaRecorder.start(10); // collect 10ms of data
     console.log('MediaRecorder started', mediaRecorder);
 }

 function handleDataAvailable(event) {
     if (event.data && event.data.size > 0) {
     socket.emit('video',event.data);
   }
 }

2-3秒后点击翻译按钮 错误如：

  

无法执行＆＃39; appendBuffer＆＃39; on＆＃39; SourceBuffer＆＃39;：这个SourceBuffer   已从父媒体来源中删除<​​/ p>

这个错误意味着什么。或者它是WebRTC的错误吗？