I am trying to get the audio through getUserMedia() using webrtc and using socket.io to send it to server(socket.io support audio , video , binarydata) and then server will broadcast it to all connected clients. The problem is when stream reaches connected clients it is converted into JSON object not media stream object. So I am unable to send audio I have also tried socket.io-stream module but I it was not succesfull. Can you please help me to capture audio stream properly and sending it to all connected clients.
Here is code of client who sends data
navigator.getUserMedia({audio: true, video: false}, function(stream) {
video.src = window.URL.createObjectURL(stream);
webcamstream = stream;
media = stream; /// here the datatype of media is mediaStream object
socket.emit("sendaudio", media);
}, function(e){
console.log(error);
});
While on receiving client the code is as follows
socket.on('receiveaudio' , function(media)
{
console.log(media); //but here i am receiving it as a simple object
other.src= media;
});
I copied my answer from here.
This example shows you how to use the MediaRecorder
to upload audio and then forward it using socket.io
. This code will only broadcast after you're called mediaRecorder.stop()
. You can choose to broadcast inside of ondataavailable
. If you do that, you might want to pass a timeslice
to mediaRecorder.start()
, so that it doesn't trigger ondataavailable
so often.
This solution isn't truly live, but I think it will help people who come back and find this question.
Client Code
var constraints = { audio: true };
navigator.mediaDevices.getUserMedia(constraints).then(function(mediaStream) {
var mediaRecorder = new MediaRecorder(mediaStream);
mediaRecorder.onstart = function(e) {
this.chunks = [];
};
mediaRecorder.ondataavailable = function(e) {
this.chunks.push(e.data);
};
mediaRecorder.onstop = function(e) {
var blob = new Blob(this.chunks, { 'type' : 'audio/ogg; codecs=opus' });
socket.emit('radio', blob);
};
// Start recording
mediaRecorder.start();
// Stop recording after 5 seconds and broadcast it to server
setTimeout(function() {
mediaRecorder.stop()
}, 5000);
});
// When the client receives a voice message it will play the sound
socket.on('voice', function(arrayBuffer) {
var blob = new Blob([arrayBuffer], { 'type' : 'audio/ogg; codecs=opus' });
var audio = document.createElement('audio');
audio.src = window.URL.createObjectURL(blob);
audio.play();
});
Server Code
socket.on('radio', function(blob) {
// can choose to broadcast it to whoever you want
socket.broadcast.emit('voice', blob);
});
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With