It's a shame that the article doesn't really go into any detail about the Recorder.js library, because that's really the most interesting part of this whole thing.
The use of a Web Worker for background processing plus all of the typed array stuff for creating a RIFF blob out of PCM data is actually pretty cool, and something that most JS developers probably haven't been exposed to much.
I'm actually working on a project right now for an in-browser guitar amp simulator and the ability to record whatever you've played. Planning on doing a pretty in-depth writeup when it's done.
Yeah, agreed. Super impressive. On that same token, you should check out http://getinstinct.com/ if you haven't seen it. Those guys are doing some really cool stuff.
Didn't you write the Recorder.js? I was able to implement it with ease for what we're doing. It has a few too many quirks to use in production but it's mostly there. Have you encountered a crash when unplugging the headphones?
I'm the original author of Recorder.js... not sure why unplugging the headphones would cause a crash. It may be an underlying bug in the Web Audio API. Feel free to file an issue, though!
The takeaway here is its not possible to record audio in chrome (in osx at least) without asking users to either enable Web Audio Input in their settings or disable the PPAPI flash plugin.
It's sad when you end up having to put messages like this in your app:
"Custom voicemails are not currently supported in Chrome on OSX. Please use another browser to record your custom voicemail."
Good article. I was actually working on my own demo[1] for recorder.js, though it's a bit out of date now. It's a tiny but impressive little library.
Worth noting that, besides exporting to a WAV and adding the object URL to an <audio> tag, recorder.js will also (using the getBuffer method) let you use the buffers directly as an actual Web Audio API source. This lets you do further processing during playback on the recorded audio.
I'm hoping by the time that I finish my silly little app (a loop box that you can add effects to, Reggie Watts[2]-style, using recorder.js and the wonderful effects library Tuna[3]), web audio recording in Chrome will be enabled out of the box on stable.
What's the security model for browser-native audio recording?
That's a worrying security hole, if you can record without getting any permission from the user -- sites could eavesdrop on visitors and upload the audio to who-knows-where (knowingly or not, via an XSS hole...).
I believe Flash needs to prompt you to access your microphone and webcam; browsers should too (even more so, because someone who has disabled all plugins may feel safer...).
You need to go to chrome://flags to enable Web Audio Input. The request for the microphone has nothing to do with that .. it's working with or without Web Audio Input.
Flahs, an evil old thing everyone seem to want to avoid. But the fact is, it usually works better than other alternatives.
Seeing many html5+js+css > Flash posts, and it's so nice when everyone is pointing out how awesome it is, until you try to do something useful like dubjoy. Where it turned out for you guys that flash is the only logical way to do it. I hope alternatives will get better soon, until then, we're stuck.
But the fact is, it usually works better than other alternatives.
They switched to HTML5 because Flash no longer worked in Chrome, it's explained in the article. That said, this "HTML5" solution looks very much like a WebKit-only solution instead, so meh.
No, they switched because chrome no longer has flash. Not because it didn't work. My point was, chrome solution for replacing flash doesn't work as good as flash.
This was true a year ago, but after the introduction of getUserMedia it's so close you can taste it. We've setup our app so as soon as all these features are stable we can have a non-Flash version with local storage, playback, and recording. Right now it's abstracted out into store and recorder classes that have a flash version and a Chrome version depending on what features are present.
Chrome is a super browser .. we all agree .. it's just not acceptable for a bug like mentioned in the article to go through canary, beta and into stable version .. and stay there for 3 week+.
This Chrome bug is affecting all the businesses that rely on voice recording. Still waiting for a fix, while users are going away from real-time web chat services.
The use of a Web Worker for background processing plus all of the typed array stuff for creating a RIFF blob out of PCM data is actually pretty cool, and something that most JS developers probably haven't been exposed to much.