Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

HTML5 Audio Streaming

There has been some talk of this around stackoverflow before, but nothing really answered this question from what I have seen.
I am trying to implement a streaming audio web application. Almost identical to what WFMU has done with their player (http://wfmu.org/html5/player.php).
All I have been able to figure out from their stream is they are piping the stream into PHP, don't know in what format, and then feeding this to jPlayer for HTML5 presentation to the client.
They have this working awesome, but I am just unsure how they are feeding the audio into PHP and what they are doing within their PHP to present it in an acceptable format for HTML5.
Any ideas would be greatly appreciated.
It looks like the PHP script just echos out an audio file (http://blogfiles.wfmu.org/DG/stream3.php).

like image 510
Mike Soule Avatar asked Mar 14 '11 23:03

Mike Soule


1 Answers

There is no requirement to use PHP. For the client, all that matters is you send the appropriate content type, and actual content. In this case, audio/mpeg (MP3), or OGG for Firefox (which, isn't working for them right now, but it definitely can).

I suspect the reason that they are using PHP to relay the stream, is that they are using SHOUTcast as the streaming server. Doing some poking around, I found this: http://mp3stream.wfmu.org:8000/

Note that when you hit that URL in your browser, you get the basic information page. However, if you hit this with an audio player, you get the stream. The SHOUTcast server decides this based on the User-Agent string. If it contains "Mozilla" anywhere in the User-Agent, then it returns this page. If it doesn't, then it returns the stream. So, for an HTML5 audio player, it would use the browser's User-Agent (which contains Mozilla) and would be unable to access the stream. I suspect their PHP script is what gets around the problem.

The PHP script would use cURL, connect to the streaming server with its own User-Agent (can be anything, as long as it isn't "Mozilla"), and relay chunk by chunk to the browser that hit the PHP script. Piece of key-lime-pie.

like image 194
Brad Avatar answered Oct 01 '22 03:10

Brad