Search code examples
javaflashcaptchahtml5-audiojplayer

SimpleCaptcha and wav playback


Our client is using SimpleCaptcha. My understanding is that SimpleCaptcha is able to produce audio captchas in WAVE format (.wav). Later these CAPTCHA-s are played back using the HTML5 audio tag, something like this:

<audio controls="controls" autoplay>
    <source src="captcha.wav" />
</audio>

Of course this is not cross browser compatible and one of the reasons is the WAVE format. This link suggests that IE9 supports only MP3 while most other browsers are fine with OGG and WAVE. Further MP3 is a patented to... to Fraunhofer?

Note: our back-end is Java based.

My question is what is the best fallback that we may offer to clients that do not support either the WAVE format (e.g. IE9) or the HTML5 audio tag at all? Due to patent issues I guess that dynamic conversion to mp3 on server side is not an option. Further I do not know any java library that may do this... I have seen nice solutions like jPlayer but they say that "For cross-browser support, a format must be supplied that works in both HTML5 and Flash.", i.e. mp3, mp4. I didn't find any reliable flash based WAVE players too.


Solution

  • With help from others in the community, I have created a Flash button that can stream WAV files from the server to the client. It is distributed with Securimage PHP Captcha for streaming audio CAPTCHAs to the client.

    You could simply take this Flash button, or download and modify the Flash source code to create your own custom one based on the same code.

    You could use it as a fallback for when HTML5 audio isn't available.

    Example usage would be:

    <object type="application/x-shockwave-flash"
            data="securimage_play.swf?audio_file=/PATH/TO/AUDIO.wav"
            width="32" height="32">
        <param name="movie" value="securimage_play.swf?audio_file=/PATH/TO/AUDIO.wav" />
    </object>
    

    You can pass these additional options to securimage_play.swf:

    • bgcol: background-color of the Flash button
    • icon_file: URL to a png image to display as the icon on the Flash button

    On a side note, I do find Microsoft's decision to not support WAV audio in the <audio> tag strange, especially since they pioneered WAV format with IBM. Yes WAV files are bigger than the other compressed audio formats they support, but bandwidth is also increasing to the point where it doesn't matter.

    Hope that helps. Let me know if you try to implement it and have any questions. You can see a demo of the audio streaming here.