Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Is it possible to Stream Audio form the Server to the client ? #73

Open
daslicht opened this issue Mar 7, 2016 · 27 comments
Open

Is it possible to Stream Audio form the Server to the client ? #73

daslicht opened this issue Mar 7, 2016 · 27 comments

Comments

@daslicht
Copy link

daslicht commented Mar 7, 2016

Is it possible to Stream Audio form the Server to the client ?
Is there any example please ?

@duncanhoggan
Copy link

Yes it is possible

Server

io.on('connection', function (socket) {
  socket.on('client-stream-request', function (data) {
    var stream = ss.createStream();
    var filename = __dirname + '/downloads/' + <YOURSONG.MP3>;
    ss(socket).emit('audio-stream', stream, { name: filename });
    fs.createReadStream(filename).pipe(stream);
  });
});

Client

var audio = document.getElementById('player');
ss(socket).on('audio-stream', function(stream, data) {
    parts = [];
    stream.on('data', function(chunk){
        parts.push(chunk);
    });
    stream.on('end', function () {
        audio.src = (window.URL || window.webkitURL).createObjectURL(new Blob(parts));
        audio.play();
    });
});

@daslicht
Copy link
Author

daslicht commented Oct 28, 2016

AWESOME, i will try it soon ! <3 THANK YOU VERY MUCH!

@daslicht
Copy link
Author

Is it also possible to send additional data with it like Metadata and is it even possible to send it to a specific point of time ?

@duncanhoggan
Copy link

You can emit it as a separate event or include it in the data object that is sent with the stream

ss(socket).on('audio-stream', function(stream, data) {}

@daslicht
Copy link
Author

ok , but what about time sensitive data ?
Lets say I like to push metadata once the Playback has reach 1Minute, 30 Seconds of the source ?
Is at hat possible at all ?

@NecroKills
Copy link

Hi, Could you provide the full code?

@zoutepopcorn
Copy link

With this html part its working:

    <audio id="player" controls>
    <source src="" type="audio/mpeg">
        Your browser does not support the audio element.
    </audio>

@zoutepopcorn
Copy link

Example over here :D
https://github.com/zoutepopcorn/audio_socket/tree/master

@schnells
Copy link

is there a way to do it in real time?

@StefansArya
Copy link

StefansArya commented Nov 25, 2018

There is a way to stream microphone in a real time, but I have small problem on my implementation..

Update:
I just uploaded this library, but it still need some improvement
https://github.com/ScarletsFiction/SFMediaStream

@avin3sh
Copy link

avin3sh commented Dec 29, 2018

@StefansArya Can I use that library to stream binary blobs (sent as chunks of 3-seconds) ? Finding it very difficult to implement

@StefansArya
Copy link

Hmm, I think you could only send the buffer data (without media header). Because that's what I can get after calling mediaRecorder.requestData().

To stream chunks of 3 seconds you need to change the latency to 3000ms. I have an example on the repository that default to 100ms, maybe you can use that for experimenting.

And don't forget to set the similar latency to the streamer too.

@ithustle
Copy link

Yes it is possible

Server

io.on('connection', function (socket) {
  socket.on('client-stream-request', function (data) {
    var stream = ss.createStream();
    var filename = __dirname + '/downloads/' + <YOURSONG.MP3>;
    ss(socket).emit('audio-stream', stream, { name: filename });
    fs.createReadStream(filename).pipe(stream);
  });
});

@duncanhoggan , is it a good idea use sockets to build a streaming server to work as a streaming service on demand?

@daslicht
Copy link
Author

daslicht commented Mar 31, 2019

that doesn't take bandwidth throttling into account no ? I just push as fast as possible no ?

@yusuf987
Copy link

Yes it is possible
Server

io.on('connection', function (socket) {
  socket.on('client-stream-request', function (data) {
    var stream = ss.createStream();
    var filename = __dirname + '/downloads/' + <YOURSONG.MP3>;
    ss(socket).emit('audio-stream', stream, { name: filename });
    fs.createReadStream(filename).pipe(stream);
  });
});

@duncanhoggan , is it a good idea use sockets to build a streaming server to work as a streaming service on demand?

ss is not defined

@yusuf987
Copy link

Yes it is possible

Server

io.on('connection', function (socket) {
  socket.on('client-stream-request', function (data) {
    var stream = ss.createStream();
    var filename = __dirname + '/downloads/' + <YOURSONG.MP3>;
    ss(socket).emit('audio-stream', stream, { name: filename });
    fs.createReadStream(filename).pipe(stream);
  });
});

Client

var audio = document.getElementById('player');
ss(socket).on('audio-stream', function(stream, data) {
    parts = [];
    stream.on('data', function(chunk){
        parts.push(chunk);
    });
    stream.on('end', function () {
        audio.src = (window.URL || window.webkitURL).createObjectURL(new Blob(parts));
        audio.play();
    });
});

what is ss here ????

@daslicht
Copy link
Author

what is ss here ????

see: https://github.com/nkzawa/socket.io-stream

@rajatlnweb
Copy link

The solution @duncanhoggan provided is working. But what it do is it firstly read the whole file then after that it plays. But What I want is, I want to stream the file into chunks. There can be the delay for max 4-5 seconds.

Can anyone please provide the solution for this?

@avin3sh
Copy link

avin3sh commented Oct 4, 2019

@rajatlnweb if you send it in chunks of 4-5 seconds, it will play it that way too.

@rajatlnweb
Copy link

rajatlnweb commented Oct 4, 2019

@avin3sh , Can you please give me the code example as I am not able to find it out anywhere?

@zoutepopcorn
Copy link

Look above: #73 (comment)

@rajatlnweb
Copy link

@zoutepopcorn , I checked your code and it's not related to chunk based audio play at all.

@jojomoore2007
Copy link

Yes it is possible

Server

io.on('connection', function (socket) {
  socket.on('client-stream-request', function (data) {
    var stream = ss.createStream();
    var filename = __dirname + '/downloads/' + <YOURSONG.MP3>;
    ss(socket).emit('audio-stream', stream, { name: filename });
    fs.createReadStream(filename).pipe(stream);
  });
});

Client

var audio = document.getElementById('player');
ss(socket).on('audio-stream', function(stream, data) {
    parts = [];
    stream.on('data', function(chunk){
        parts.push(chunk);
    });
    stream.on('end', function () {
        audio.src = (window.URL || window.webkitURL).createObjectURL(new Blob(parts));
        audio.play();
    });
});

Could you do that client -> server -> client?
Like a peer-to-peer voice chat?
Just trying to make something for my non-programmer friends.

@duncanhoggan
Copy link

@jojomoore2007 For that use case I would recommend using WebRTC or something similar, it would scale much better and would be a true peer to peer implementation as opposed to the server middleman.

@viradiya1993
Copy link

Hello
Streaming music synchronously from an mp3 file via an Angular + socket. io I have an mp3 file on my server.

And I want all my clients who visit that URL to listen to that music in sync.

That is.

Let's say the file plays for 6 minutes.

I start the song at 10:00 am

A request which comes at 10:03 am should start listening from the 3rd minute of the song.

All my clients should listen to the song in sync.

How can I achieve this with Angular and socket.io?

@bailhongalGIT
Copy link

Hello Streaming music synchronously from an mp3 file via an Angular + socket. io I have an mp3 file on my server.

And I want all my clients who visit that URL to listen to that music in sync.

That is.

Let's say the file plays for 6 minutes.

I start the song at 10:00 am

A request which comes at 10:03 am should start listening from the 3rd minute of the song.

All my clients should listen to the song in sync.

How can I achieve this with Angular and socket.io?

Hi @viradiya1993 , did you get any solution for this?

@Jobin-S
Copy link

Jobin-S commented Sep 29, 2023

isten to the song in sync.

I also need a solution for this. does anyone know how to implement this?

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests