ryanheise / just_audio

Audio Player
1.03k stars 638 forks source link

ICY Metadata - full metadata (and availability for flutter web) #528

Open dpacchi opened 2 years ago

dpacchi commented 2 years ago

Is your feature request related to a problem? Please describe. ICY metadata are a great thing when developing a webradio player. Currently the IcyMetadata object contains only a "title" property and not a full list of available metadata (artist, song title, artwork url). Here's an example of the code I'm using and a link to a webradio that correctly streams the artwork image url. StreamBuilder<IcyMetadata?>( stream: _player.icyMetadataStream, builder: (context, snapshot) { if (!snapshot.hasData) { return SizedBox.shrink(); } print(snapshot.data?.info?.title); }, ) ,

https://stream-uk1.radioparadise.com/aac-320

Describe the solution you'd like A Map<String,String> fullMetadata property in the IcyMetadata object. Or all the metadata unpacked in the right properties (artist, song, album artwork) but I think it's best the first solution. And also, it would be a really good thing to have this feature also available for a web player made in flutter.

Describe alternatives you've considered The radio_player package already have artworks support but only for iOS/Android

Additional context Add any other context or screenshots about the feature request here.

ryanheise commented 2 years ago

I don't know if this is even possible for the web. If you know what browser API supports this, please share.

However, certainly it's on the TODO list to report more metadata on the iOS side. Currently only the Android side is complete.

ryanheise commented 2 years ago

P.S. That url (https://stream-uk1.radioparadise.com/aac-320) is currently giving a 502.

ryanheise commented 2 years ago

OK, that URL is working again, so I was able to at least do some testing and fixing on the iOS side, and have the URL metadata now being reported. Before I commit that, I might create a radio example.

Can I ask, is that URL you provided above a public URL that I can use in this example? Since it gave a 502 earlier I'm wondering whether it would be reliable enough to use as an example.

dpacchi commented 2 years ago

Thanks, that fix is gold ;) I'm not familiar instead about ICY metadata parsing on a webplayer, sorry.

I picked the url from another package published on pub.dev so I think it's public but I don't know for sure.. I used it for some time doing some research and it never gave me 502 so maybe was a temporary issue.

PS. the title is meant to be a single property with the artist and the song title united? Don't you think it would be better to have them separate?

Bye!

ryanheise commented 2 years ago

I've published the iOS fix on the fix/ios_livestream if you'd like to test it before I publish a release.

ryanheise commented 2 years ago

@dpacchi have you found the fix/ios_livestream branch to work for you on the iOS front?

dpacchi commented 2 years ago

Hi, Schermata 2021-10-04 alle 10 51 17

Yes I've tested the ios_livestream branch and it seems ok!

Don't you think it would be useful to have artist name and song in two separate fields?

Thanks

ryanheise commented 2 years ago

I don't think that format should be assumed by just_audio, and instead it should just report the raw metadata values exactly as they appear under each tag. If your app can make that assumption, it should be OK for your app to parse that format.

dpacchi commented 2 years ago

Ok thanks

ryanheise commented 2 years ago

FYI, the URL metadata fix for iOS is now published in release 0.9.13.

As for web, I still don't have any idea of how this can actually be done, so I would encourage you or others to share below any techniques that you find. If it's not possible, I'll close the issue.

dpacchi commented 1 year ago

Hi, how are you?

I was just wandering if there are any updates on the ICY Metadata stream using just audio in a flutter web application.

I leave you this repo that maybe helps, thanks! https://github.com/TooTallNate/node-icy

ryanheise commented 1 year ago

Thanks for sharing. The key paragraph in that README is:

A good use case for this module is for HTML5 web apps that host to radio streams; the

Still, an example of that would be helpful. If we are to pipe the clean audio data through to the actual player, that will probably require a Web Audio-based implementation (which just_audio isn't currently based on).

agreensh commented 3 months ago

Would this be of any help?

Turns out that if you add an extra header when you connect to the server you can make it send you a different stream which is made up of the mp3 and the metadata spliced together. The problem is that your browser won't play it, as it's not a proper mp3.

This is a simple service worker which will intercept network requests from any html audio elements on your page and add the header to a fetch request to retrieve the metadata stream from your server.

It then handles the response, splitting the metadata and the mp3 data and returns the mp3 data as a readable stream to your audio element and posts a message containing the metadata to your main window.

The header needed to make the server output the metadata stream is only available under the same origin, this is a limitation of the fetch api so if your web server is on a different domain to your streaming server you'll have to come up with your own workaround for that.

https://github.com/cryptiksouls/icecast-shoutcast-metadata-grabber