Update 6/1/11: WebRTC looks very promising.
Update 11/05/09: Looks like this might be possible in Flash 10.1! (via)
I’ve been working on a project recently that would really benefit from the ability to record audio in the browser and upload it to a web server. This would be a better experience than an “upload your sound file” dialog, where the user would have to record themselves in another app, find the file, and upload it. Here’s how I imagine a seamless audio capture experience would work inside a web application. There would be a small widget in the page that would look like this (icons from FamFamFam.com):
When the widget first shows, only the record button would be enabled. The left side has a line-level indicator that reflects the sound level at all times.
While recording, the recording button changes to a stop button.
Once the recording is stopped, the stop button changes back to a record button. The play and upload buttons are enabled. Clicking upload at this point saves the file to the server, and the whole control would change to an upload progress bar. Clicking record here starts a new recording and erases the old one.
During playback, the record button toggles to a stop button again and the play button toggles to a pause button. The line level reflects the playback volume. It is possible that you don’t want to allow upload during playback, but I’m not sure.
I want the control to be slightly customizable for the web developer who’s embedding it. He/she should be able to specify a maximum recording length and a URL where the sound file will be uploaded, or perhaps disable playback and upload immediately, that sort of thing. Maybe the control itself is actually a 1×1 SWF that has methods and events for play, stop, record, and so on, and the controls would be standard HTML wired up with JavaScript.
I assumed that other, smarter people have already tackled this problem and there is some Flash control I could embed in my page and a little PHP script or something to handle saving the file from a POST. If you’ve ever searched for this sort of thing before, you already know that it does not yet exist, at least not like I have described it. Microsoft Silverlight doesn’t yet have microphone access, and I can’t find a Java applet that does this thing either. (I found this one, hmmm. Wish it was free/Flash). There are several very nice Flash playback scripts (SoundManager 2, Yahoo Media Player, JW FLV Media Player, JPlayer, NiftyPlayer, WordPress Audio Player, etc. etc. etc.), but nothing that handles creating uploading and saving recordings. Yet.
Flash allows for audio streaming from the client microphone, but in order to capture the stream you need a server that understands Adobe’s streaming format called RTMP and can do something with it, most likely some kind of crazy-expensive Flash Media Server or the open source Red 5 server. Neither solution is exactly straightforward or doable on a simple web host; it’s huge overkill for this one thing. If your project is meant to be downloaded and run on other servers (like WordPress and my new project) this kind of requirement is deal breaker. Besides, it doesn’t really allow you to preview the recording before it’s uploaded. Frustration with Adobe’s “closed” microphone interface has caused some Flash developers to start the Open Mic initiative at GetMicrophone.com. I wish them luck with their effort.
I recently asked my friend Joey Betz (a very talented Flash programmer who works for Armor Games) if what I describe above is possible. He said that up until Flash 9 it is impossible, but he could imagine that with new access to microphone sound data in Flash 10, it may be possible to get the byte stream of the sound and base-64 encode and post it to a web script. I guess nobody has the combined need, interest and Flash/PHP chops to make it happen – I have all but the Flash bit. I’m not sure anyone knows the actual format of the byte stream: is it just raw sound like a WAV or what? Can you turn around and replay that byte stream through Flash? How do you turn it into an MP3/OGG stream? Even if the byte stream is something odd or uncompressed, perhaps the PHP script could do the heavy lifting to re-encode it; many servers also have FFMPEG or Mencode or something like them installed. Alternatively, what about a web service with an API where I can stream data to a Flash Media Server or something like it and get back a URL to the resulting MP3? I just don’t think recording a few seconds of sound and saving it to a file requires a separate server daemon and all that entails. Real-time voice/video chat — sure, but that’s not what I’m after.
Unless someone can convince me that this is still not possible, I will be happy to offer some of my time and server bandwidth, hosted now at MediaTemple, to help a creative Flash programmer get the server-side bit of this working. I’d like to release this widget/script as open source to the web community. I am looking especially to the creators of any of the aforementioned Flash playback scripts. Can you help make this happen?