jsmediatags icon indicating copy to clipboard operation
jsmediatags copied to clipboard

Can this be used for web radios?

Open Heshyo opened this issue 8 years ago • 17 comments

I'd like to If I have a web radio stream, can I use jsmediatags in the browser to get the info about the currently played music? And will I get updates each time a new music plays?

Heshyo avatar Apr 27 '16 09:04 Heshyo

They would need to send mp3 with ID3 metadata (or any other supported format). Today I don't have a file reader for streams though, can you give an example?

aadsm avatar Apr 28 '16 18:04 aadsm

Thanks. The following stream contains the "Now playing" info (nothing else). I can see it when opening it with VLC. http://ns347811.ip-5-196-91.eu:8000/rci-zouk.mp3

Heshyo avatar Apr 29 '16 03:04 Heshyo

Thanks for the sample, this doesn't seem to be ID3 tags though (or any other this library supports). I've even run strings through it and didn't find anything that could be identified as an artist or title name. Do you know what metadata type is being sent in the stream?

aadsm avatar Apr 29 '16 16:04 aadsm

No idea about the metadata type. I just used VLC to check whether the stream was containing data on top of audio. Here are some screenshots of what VLC sees, HTH: capture capture2 capture3

Heshyo avatar Apr 30 '16 06:04 Heshyo

I've looked into the headers and noticed this is an Icecast stream. The reason I didn't find any metadata in the stream is because a Icy-MetaData: 1 request header is needed for the server to send it. The metadata is sent on every x number of bytes streamed. I haven't tried but it should be possible to read this using the progress event that XHR emits now. The biggest issue on the browser would be using CORS, but should be possible in a node environment. I'll look into it.

This blog post explains how to read the metadata: http://www.smackfu.com/stuff/programming/shoutcast.html.

aadsm avatar Apr 30 '16 17:04 aadsm

I've played a bit on how to implement this and have a proof of concept locally (only working in node). Still need to polish the API a bit before shipping. I'm not confident I'll be able to make this work on the browser because these servers don't seem to work with CORS. The one you point to certainly doesn't.

aadsm avatar Apr 30 '16 22:04 aadsm

@aadsm How close are you to pushing that stream reader implementation? I could use that as well, though just for reading from local file streams

emschwartz avatar May 02 '16 22:05 emschwartz

(I'm happy to review it or help out if you need it)

emschwartz avatar May 02 '16 22:05 emschwartz

@aadsm Thanks, I really didn't know anything about data streams before.

CORS won't cause issue in node nor in Cordova/Phonegap applications, so your work on it could also be used in hybrid apps. As for browsers, I guess most of those streams indeed don't handle CORS.

I'll see if I could provide a stream with CORS if that could help you.

Heshyo avatar May 02 '16 23:05 Heshyo

I can push the first commit I have under a branch. However, DO NOT use this in production, I will change the API :)

aadsm avatar May 03 '16 16:05 aadsm

Sounds good, thanks!

On Tue, May 3, 2016 at 9:50 AM, António Afonso [email protected] wrote:

I can push the first commit I have under a branch. However, DO NOT use this in production, I will change the API :)

— You are receiving this because you commented. Reply to this email directly or view it on GitHub https://github.com/aadsm/jsmediatags/issues/18#issuecomment-216592793

Evan Schwartz | Software Architect | Ripple [image: ripple.com] http://ripple.com

emschwartz avatar May 03 '16 17:05 emschwartz

Btw, the way to use this is (for now):

var IcyStreamTagReader = require('./src/IcyStreamTagReader');

new IcyStreamTagReader("http://ns347811.ip-5-196-91.eu:8000/rci-zouk.mp3")
  .read({
    onUpdate: function(tags) {
      console.log(tags);
    },
    onFailure: function(error) {
      console.log('error', error);
    }
  });

aadsm avatar May 04 '16 14:05 aadsm

@aadsm Thanks, I haven't had time to test it yet. But one question though: if I want to be able to listen to the stream and display the "now showing" info, should I have an audio tag plus an IcyStreamTagReader? Will I end up downloading the stream twice?

Heshyo avatar May 16 '16 05:05 Heshyo

What do you mean with audio tag? But yeah, if you play the stream in a player and use this library to read the tags you will download the stream twice because they're different apps. Ideally the player should support reading tags.

On Sunday, May 15, 2016, Heshyo [email protected] wrote:

@aadsm https://github.com/aadsm Thanks, I haven't had time to test it yet. But one question though: if I want to be able to listen to the stream and display the "now showing" info, should I have an audio tag plus an IcyStreamTagReader? Will I end up downloading the stream twice?

— You are receiving this because you were mentioned. Reply to this email directly or view it on GitHub https://github.com/aadsm/jsmediatags/issues/18#issuecomment-219352640

Best regards, António Afonso

aadsm avatar May 19 '16 07:05 aadsm

@aadsm Yes this is what I mean. If the player supports it it's best of course. But for "now playing" metadata on a stream, we shouldn't need to download the stream forever, right? We should be able to connect, check the metadata, disconnect, then redo it eg every 5s.

BTW, what is your use of your library? It's not to display what's being played?

Heshyo avatar May 19 '16 09:05 Heshyo

@Heshyo my main usage is to display a list of songs. I don't necessarily play them.

aadsm avatar Jan 04 '17 05:01 aadsm