Обновление капчи в Битрикс

Обновление капчи — необходимый функционал, без него сильно страдает юзабилити форм на сайте. Рассмотрим как сделать обновление captcha в компоненте обратная связь (main.feedback). Этот способ подойдет и для других компонентов.

Обновление капчи будет происходить с помощью технологии ajax. Создадим php файл на сервере, к которому будет обращаться скрипт для получения новой картинки captcha. Например /ajax/refresh_captcha.php. В этом файле кода будет не много:

<?
require_once($_SERVER["DOCUMENT_ROOT"] . "/bitrix/modules/main/include.php");
echo CMain::CaptchaGetCode();
?>

Далее в нужное место на сайте ставим компонент обратной связи

<?$APPLICATION->IncludeComponent("bitrix:main.feedback","",Array(
		"USE_CAPTCHA" => "Y",
		"OK_TEXT" => "Спасибо, ваше сообщение принято.",
		"EMAIL_TO" => "my@email.com",
		"REQUIRED_FIELDS" => Array("NAME","EMAIL","MESSAGE"),
		"EVENT_MESSAGE_ID" => Array("5")
	)
);?>

Далее копируем шаблон компонента, заходим в template.php, ищем там строку

<?if($arParams["USE_CAPTCHA"] == "Y"):?>

Внутри этого условия выводится капча. Там тег img оборачиваем в div с id=’captcha_container’

<div id="captcha_container">
 <img src="/bitrix/tools/captcha.php?captcha_sid=<?=$arResult["capCode"]?>" width="180" height="40" alt="CAPTCHA">
</div>

И к input с классом captcha_sid добавляем id=’captcha_sid’

<input type="hidden" id="captcha_sid" name="captcha_sid" value="<?=$arResult["capCode"]?>">

Добавляем в шаблон ссылку с id=’refresh_captcha’

<a id="refresh_captcha" href="#">Обновить картинку</a>

Создаем  в папке с шаблоном файл script.js, в котором будет инициироваться ajax запрос для обновления капчи со следующим кодом

(function ($) {
 $(function () {
 $('#refresh_captcha').click(function() {
 $.get(
 '/ajax/refresh_captcha.php',
 {},
 function(data) {
 $('#captcha_sid').attr('value', data);
 $('#captcha_container')
  .empty()
  .append('<img src="/bitrix/tools/captcha.php?captcha_sid=<?=$arResult["capCode"]?>" width="180" height="40" alt="CAPTCHA">);
 }
 );
 return false;
 });
});
})(jQuery);

Обновление капчи (captcha) в битрикс

Похожие статьи

Статья оказалась полезной? Вырази благодарность - поделись в соцсетях

Отзывы : 4 комментария

  1. Вы в статье написали, что нужно создать файл /ajax/refresh_captcha.php, но зачем? В битриксе есть стандартный файл для получения идентификатора новой капчи. Адрес стандартного генератора:
    /bitrix/tools/ajax_captcha.php
    Только он возвращает данные в JSON, но это совсем не проблема

    • Да, наверно правильнее будет использовать стандартный функционал, немного изменив функцию под другой формат возвращаемых данных

  2. Код:

    $(‘#captcha_container’)
    .empty()
    .append(‘<img src="/bitrix/tools/captcha.php?captcha_sid=» width=»180″ height=»40″ alt=»CAPTCHA»>);

    можно заменить на

    $(‘#captcha_container’).html(‘<img src="/bitrix/tools/captcha.php?captcha_sid=» width=»180″ height=»40″ alt=»CAPTCHA»>);

    Спасибо за статью )

Комментирование отключено