音頻內(nèi)容

為了方便視障用戶使用，驗(yàn)證碼的扭曲圖像可以以音頻格式表示，每個(gè)字母數(shù)字字符都是用標(biāo)準(zhǔn)音標(biāo)讀出的。

默認(rèn)情況下在驗(yàn)證碼旁邊呈現(xiàn)一個(gè)音頻按鈕，為相應(yīng)的圖像提供畫外音，還提供了允許用戶調(diào)整音頻音量的滑塊。

啟用驗(yàn)證碼音頻

Kendo UI Captcha服務(wù)器端提供程序基于圖像的內(nèi)容創(chuàng)建音頻文件，在您的項(xiàng)目中啟用Captcha的旁白：

1.將Captcha服務(wù)器端提供程序添加到項(xiàng)目中。

2.將AudioHandler選項(xiàng)添加到驗(yàn)證碼中，并向遠(yuǎn)程端點(diǎn)發(fā)送請(qǐng)求，并將驗(yàn)證碼的ID作為附加參數(shù)包含在內(nèi)。

<script>
$("#captcha").kendoCaptcha({
handler: "./reset",
audioHandler: function (args) {
args.success("./audio?captchaId=" + args.data.captchaId);
},
validationHandler: "./validate",
error: function (data) {
console.log(data);
}
});

</script>

3.使用CaptchaHelper.SpeakText()方法創(chuàng)建wav文件，將其返回到客戶端。

public ActionResult Audio(string captchaId)
{
CaptchaImage captcha = (CaptchaImage)Session["captcha" + captchaId];

byte[] bmpBytes;

using (MemoryStream audio = CaptchaHelper.SpeakText(captcha))
{
bmpBytes = audio.ToArray();
}

return File(bmpBytes, "audio/wav");
}

4.在用戶點(diǎn)擊音頻按鈕后，Kendo UI驗(yàn)證碼會(huì)啟動(dòng)圖像的旁白。