HTML5 Audio

Securimage 3.6 uses HTML5 audio controls for captcha audio playback without the need for any plugins (i.e. Adobe Flash, Windows Media Player, or VLC). However, due to differences between various browsers and versions, there are some things to be considered, primarily in regards to Microsoft Internet Explorer.

Internet Explorer 9 was the version version supporting the HTML5 <audio> tag but despite the fact that Microsoft helped pioneer the WAV audio format, IE9-11 do not support playback of wave files. Securimage produces audio outpuat in wave format, so to get around this, MP3 support (smaller file size and supported by IE9+) is available if you have the LAME MP3 encoder installed on your system (see Installing LAME below).

If the LAME encoder is not available, Securimage will fall back to using Adobe Flash playback in Internet Explorer browsers. IE versions less than 9 will use Flash by default, if available. Note: Flash fallback can be disabled completely, in which case the audio button with be hidden.

Other browsers such as Firefox, Chrome, Opera and mobile browsers on Android and iOS that support HTML5 audio typically support MP3 or wave format. If you are able to install the LAME encoder on your system, Securimage will add the appropriate audio source tags for both MP3 and WAV audio.

Below is a table showing how Securimage handles HTML5 audio playback in different browsers:

Installing LAME

Securimage depends on having the LAME binary package installed somewhere on your system. Installing it varies by platform.

On Unix/Linux, you can install from source, or take the much easier route and install using your system’s package manager if available.

For Debian/Ubuntu:

sudo apt-get install lame

For RHEL/CentOS:

yum install lame

On Windows, you can download a binary package from RareWares (note, MP3 conversion is not heavily tested on Windows platforms).

Configuring Securimage to use LAME

Once LAME is installed on your system, you need to tell Securimage the path to it. There are two ways of doing this:

– Find and modify the property $lame_binary_path in securimage.php

public static $lame_binary_path = '/path/to/lame';

– Set the value in securimage_play.php (after the include/require of securimage.php)

Securimage::$lame_binary_path = '/path/to/lame';

On Windows this would look like either:

public static $lame_binary_path = 'C:/lame/lame.exe';

or:

Securimage::$lame_binary_path = 'C:/lame/lame.exe';

Note: If you are using Securimage::getCaptchaHtml() to render the captcha output, it is best to change this value in securimage.php so the value is set when calling securimage_play.php and getCaptchaHtml(), otherwise you will need to define it in both places.

Disable Flash fallback

If you wish not to have Flash fallback enabled for browsers that do not support HTML5 audio, you can pass an option to Securimage::getCaptchaHtml() so the Flash code will not be included. For browsers not supporting HTML5 audio, the audio button will be hidden after detection is run.

$options = array('disable_flash_fallback' => true);
echo Securimage::getCaptchaHtml($options);