Lecture des données binaires audio ArrayBuffer entrantes à partir du serveur binaryjs simultanément

Question

Bonne journée! Je suis en train de regarder des vidéos en streaming ce matin et j'ai rencontré un problème avec le ArrayBuffer entrant qui contient des données binaires d'un fichier audio.

Voici le code que je trouve pour la lecture des données audio binaires (Uint8Array):

function playByteArray(byteArray) { 
    var arrayBuffer = new ArrayBuffer(byteArray.length); 
    var bufferView = new Uint8Array(arrayBuffer); 
    for (i = 0; i < byteArray.length; i++) { 
     bufferView[i] = byteArray[i]; 
    } 
    context.decodeAudioData(arrayBuffer, function(buffer) { 
     buf = buffer; 
     play(); 
    }); 
} 

// Play the loaded file 
function play() { 
    // Create a source node from the buffer 
    var source = context.createBufferSource(); 
    source.buffer = buf; 
    // Connect to the final output node (the speakers) 
    source.connect(context.destination); 
    // Play immediately 
    source.start(0); 
} 

maintenant ci-dessous, je l'ai utilisé MediaStreamRecorder de https://github.com/streamproc/MediaStreamRecorder pour enregistrer le flux de getUserMedia. Ce code envoie en continu les données binaires enregistrées au serveur.

if (navigator.getUserMedia) { 
     navigator.getUserMedia({audio: true, video: true}, function(stream) { 
      video.src = (window.URL || window.webkitURL).createObjectURL(stream); //get this for video strewam url 
      video.muted = true; 
      multiStreamRecorder = new MultiStreamRecorder(stream); 
      multiStreamRecorder.canvas = { 
       width: video.width, 
       height: video.height 
      }; 
      multiStreamRecorder.video = video; 

      multiStreamRecorder.ondataavailable = function(blobs) { 
      var audioReader = new FileReader(); 
       audioReader.addEventListener("loadend", function() { 
       var arrBuf = audioReader.result; 
       var binary = new Uint8Array(arrBuf); 
       streamToServ.write(binary); 
       // streamToServ is the binaryjs client 
       }); 
       audioReader.readAsArrayBuffer(blobs.audio); 
      }; 
      multiStreamRecorder.start(1); 
     }, onVideoFail); 
    } else { 
     alert ('failed'); 
    } 

Convertir les blobs produits en binaire et envoyer (audio et vidéo) à binaryjs qui sera joué sur un autre client avec ceci:

client.on('stream', function (stream, meta) { 
    stream.on('data', function(data) { 
     playByteArray(new Uint8Array(data)); 
    }); 
}); 

J'ai eu aucun problème avec le transfert des données binaires mais le problème est qu'il y a un son hiccup dans la lecture de manière significative sur chaque donnée binaire qui a été jouée. Y a-t-il quelque chose qui ne va pas dans la façon dont je joue les ArrayBuffers entrants? Je pense aussi à demander à streamproc à ce sujet.

Merci d'avance!

Cheers.

Answer 1

J'ai trouvé une solution à ce problème en faisant une mise en file d'attente de tampon audio. La plupart du code est d'ici:

Choppy/inaudible playback with chunked audio through Web Audio API

Merci.

Answer 2

Vous ne savez pas si c'est le problème, mais peut-être qu'au lieu de source.start (0), vous devriez utiliser source.start (time), où l'heure est l'endroit où vous voulez démarrer la source. source.start (0) commencera à jouer immédiatement. Si votre tableau d'octets arrive plus vite que le temps réel, les sources peuvent se chevaucher car vous les démarrez le plus rapidement possible.