Related link: http://digitalmedia.oreilly.com/2005/02/23/mp3_embed.html
After reading my article “Build a Simple MP3 Player for Your Site,” a visitor asked if it were possible to use the technique to create a streaming media player on the fly.
It is. The technique in the article simply pops open a window with an embedded media player when someone clicks a special JavaScript link. You can embed whatever you want in the window. To play formats like RealAudio, you may need to change the embedding code in the external JavaScript file. There’s some sample code here that may be useful.
But I just tried the current code, using an m3u file instead of an MP3, and it worked fine. (An m3u file is simply a text file containing the URL of the MP3 and the extension .m3u.) In fact, using an m3u link even cleared up the stuttering problem I had experienced with some MP3 files on the Mac.
If you do decide to stream MP3s, though, you should probably provide low-bandwidth versions for dial-up visitors. In “The Real Secret of Streaming MP3s,” Emmy-nominated sound editor Skip Adams recommends using 16kbps, 11kHz mono files.
Update, May 1, 2006: See my comment below about adding an additional parameter to prevent the missing plug-in error on some browsers.
How are you presenting audio files on your site?
Categories
Web
Comments (7)
Read More Entries by David Battino.
I finally found the missing parameter that makes this work (especially for Windows systems without QuickTime):
Add the parameter type=application/x-mplayer2 for Windows and type=audio/mpeg for Mac OS and Linux. That forces Windows browsers to use Windows Media Player instead of asking for QuickTime.
There's a good explanation here, along with two streaming MP3 examples.
I developed a more elaborate version today that handles WMA as well. (The type value for non-windows browsers in that case is audio/x-ms-wma. It worked on Internet Explorer 6 and 7 (Windows), Firefox (Mac/Win), Opera (Mac/Win), Camino (Mac), and Safari (Mac). The only snag was that Opera Mac wanted to load the whole file before starting to play. I wasn't able to test Linux. If you are, check out the link above and let me know what you find.
I have been terribly annoyed (got here via Google) and finally figured out how to fix this, at least on my Mac -- I am not sure if a similar method will work on Windows, but it might:
I went in (after shutting down Firefox, of course) to the file called "pluginreg.dat" and just added a new line in the QuickTime section:
60:audio/x-mpegurl:MP3 Playlist:m3u:$
In the [QuickTime portion] header for this file there was a line saying "60" for the number of plugin lines that followed (0-59, that is why my line starts with 60), after adding my line to the end of the section I just had to increment this QuickTime header line by one to 61.
After I restarted, anything that had the correct MIME type worked like a charm -- I haven't been able to verify with a .m3u extention and bad MIME type however.
Trouble for non-embedded .m3us
I already have the mime type defined on the server, the problem is really with the client. Firefox doesn't seem to allow the definition of one program as the handler of a file type when it is downloaded and another program (plugin) when the same file type is embedded.
Trouble for non-embedded .m3us
Googling Firefox m3u turns up lots of suggestions for working around the Firefox problem. One site I found recommends changing the htaccess file on your server.
I also came across a slick-looking MP3-streaming system called Andromeda. —David
Trouble for non-embedded .m3us
According to w3schools.com, the classid and codebase attributes are only used by ActiveX. That's fine for IE6 and it did in fact make IE use QuickTime instead of WMP but it doesn't help in Firefox. Firefox still asks for a plugin.
Trouble for non-embedded .m3us
Interesting. What happens if you specify a plug-in within the external JavaScript file by adding
CLASSIDandCODEBASEparameters? Currently our embedding code is rather generic. —DavidTrouble for non-embedded .m3us
When I first tried this, simply using the old code with an .m3u file, IE6 played it using WMP9 but Firefox said it was lacking the necessary plugin. I have the latest version of QuickTime but it was not registered as the handler of .m3u files. I went into its control panel and made it so after which it successfully played the stream in Firefox *and* IE6.
However, this created trouble for non-embedded .m3u files. I run an on-demand site that uses Apache::MP3, a module that creates .m3u files on the fly to stream mp3s. Normally the .m3u files are downloaded and opened using a default appliction, iTunes, WinAmp, RealPlayer, whatever. After registering QuickTime as the handler of the mime type however, the plugin attempted to play these files within the browser. Unfortunately it failed to do so. I had the same result attempting to listen to an Internet radio station, Radio Paradise. Many Internet radio streams use .pls files instead of .m3u so the mime type change doesn't affect them but for me it's a killer. Ideally embedded .m3u files would be handled by a plugin and the rest by a helper app.