Captcha AudioHandler vs AudioHandlerFunction

[Jack]

I've been struggling with the Captcha audio not playing on my page. I think I've figured it out but would like to confirm if this is the correct method.

I had been using the AudioHandler method with a URL to the audio source. This results in the wav data getting passed to _playAudio which gets passed to "new Audio()". This does not seem to be correct based on the Audio constructor. The examples all use AudioHandlerFunction which returns a URL, so I expected the two similar methods to produce the same results.

Instead, AudioHandlerFunction directly configures the URL for the audio. AudioHandler configures a URL that is fetched that contains a URL to where the audio is. This seems counterintuitive as the AudioHandler adds the captcha ID to the URL request.

Could a helper method be added to link directly to the audio source? Something like:

Html.Kendo().Captcha()
            .Name("captcha")
            .CaptchaId((string)ViewData["CaptchaId"])
            .Handler(handler => handler.Action("Reset", "Captcha"))
            .ValidationHandler(handler => handler.Action("Validate", "Captcha"))
            .CaptchaAudio(handler => handler.Action("Audio", "Captcha"))

This would bypass the need to have javascript to process the url:

        function audioHandler(args) {
            var url = '@Url.Action("Audio", "Captcha")';
            args.success(url + "?captchaId=" + args.data.CaptchaId);
        }

[Alexander]

Hi Jack,

Based on the provided information, I am not entirely sure of the scenario you have at hand. Could you please elaborate more on what you exactly mean by "This results in the wav data getting passed to _playAudio which gets the passed to new Audio()". Regardless, the .AudioHandler() configuration option has a string overload which can be used for passing the id to the controller as well. You can notice this within the CaptchaBuilder class definition:

    public class CaptchaBuilder : WidgetBuilderBase<Captcha, CaptchaBuilder>
    {
        public CaptchaBuilder(Captcha component);

        public CaptchaBuilder AudioHandler(Action<CrudOperationBuilder> configurator);
        public CaptchaBuilder AudioHandler(string url);
    }

From there, you could pass the URL as follows:

@(Html.Kendo().Captcha()
            .Name("captcha")
            .CaptchaId((string)ViewData["CaptchaId"])
            .AudioHandler(@Url.Action("Audio","Captcha",new {captchaId=ViewData["CaptchaID"]}))
)

With that being said, I would also recommend reviewing the following article that you might find helpful as well:

• https://docs.telerik.com/aspnet-core/html-helpers/editors/captcha/audio#the-captcha-audio

Looking forward to hearing back from you.

Regards,
Alexander
Progress Telerik