Ottenere l'audio streaming dai server ai client NodeJS

Question

ho bisogno di avere un flusso audio dal vivo in tempo reale dal 1 client a un server per più client ascoltatore.

Attualmente ho la registrazione dalla lavorazione client e streaming l'audio attraverso socket.io al server. Il server riceve questi dati e deve trasmettere l'audio (anche tramite socket.io?) Ai client che vogliono ascoltare questo stream. Deve essere il più realistico possibile (ridurre al minimo il ritardo).

sto usando GetUserMedia per registrare il microfono (compatibilità del browser non è importante qui). Voglio che i client utilizzino tag audio HTML5 per ascoltare lo streaming. I dati ricevuti sul server sono blocchi (attualmente imballati da 700) imballati in un blob con tipo audio/wav.

Questo è il mio codice di inviare al server:

mediaRecorder.ondataavailable = function(e) { 
    this.chunks.push(e.data); 
    if (this.chunks.length >= 700) 
    { 
     this.sendData(this.chunks); 
     this.chunks = []; 
    } 
}; 
mediaRecorder.sendData = function(buffer) { 
    blob = new Blob(buffer, { 'type' : 'audio/wav' }); 
    socket.emit('voice', blob); 
} 

Sul server sono in grado di inviare i pezzi al client nello stesso modo in questo modo:

socket.on('voice', function(blob) { 
    socket.broadcast.emit('voice', blob); 
}); 

On il cliente posso giocare a questo come questo:

var audio = document.createElement('audio'); 
socket.on('voice', function(arrayBuffer) { 
    var blob = new Blob([arrayBuffer], { 'type' : 'audio/wav' }); 
    audio.src = window.URL.createObjectURL(blob); 
    audio.play(); 
}); 

questo funziona per la prima blob di blocchi mando, ma non ti è permesso ke ep cambiando in audio.src in una nuova sorgente URL quindi questa non è una soluzione funzionante.

penso di avere a creare una sorta di flusso sul server che posso mettere nel tag audio del HTML5 sui client di ascolto, ma io non so come. I BLOB ricevuti con blocchi dovrebbero essere aggiunti a questo stream in tempo reale.

Qual è l'approccio migliore per farlo? Lo sto facendo direttamente dal microfono del client al server?

Answer 1

Si potrebbe cambiare audiosrc dinamicamente come segue (supponendo tipo mp3):

<audio id="audio" controls="controls"> 
    <source id="mp3Source" type="audio/mp3"></source> 
     Your browser does not support the audio format. 
</audio> 

chiamata seguente funzione ogni volta, evento presa ricevuto:

function updateSource() { 
     var audio = document.getElementById('audio'); 

     var source = document.getElementById('mp3Source'); 
     source.src= <blob>; 

     audio.load(); //call this to just preload the audio without playing 
     audio.play(); //call this to play the song right away 
    } 

Answer 2

Sono un po 'tardi per la fai festa qui, ma sembra che l'API audio web sia tua amica qui, se non l'hai già finita. Ti consente di riprodurre un flusso audio direttamente sul dispositivo di output senza fare confusione con il collegamento a un elemento audio.

sto cercando di fare la stessa cosa e la vostra domanda ha risposto alla mia domanda - come ottenere i dati dal client al server. Il vantaggio dell'API audio web è la possibilità di aggiungere flussi insieme e applicare effetti audio sul server.

MDN Web Audio API

Gli eventi io dovrebbero sostituire i dati in un oggetto buffer audio nel contesto audio. L'elaborazione audio può avvenire nel contesto audio web di nodeJS prima di essere emessa come singolo flusso per ogni client.