Блог «Дивасофт»

Есть несколько способов подключения и инициализации рекапч, но самый удобный это тот, который занимает мало строчек кода, и максимально эффективен.

В init.php добавляем код, инициализирующий рекапчу. Код добавляется структурно после подключения всех стилей и скриптов, что исключает ошибку раннего старта рекапчи. Код добавляется именно через addString(), а не через addScript():

<?php 

// Открытый ключ
define("DVS_RC_KEY","123");
// Секретный ключ 
define("DVS_RC_SECRET","321");
use Bitrix\Main\Page\Asset;
use Bitrix\Main\Page\AssetLocation;
if (!defined("DVS_RECAPTCHA")) {
	// Подключаем скрипт рекапчи
	    Asset::getInstance()->addString('<script src="//www.google.com/recaptcha/api.js?onload=divaCaptchaRender&render=explicit" async defer></script>',
	 true, AssetLocation::AFTER_JS);
	// Инициализируем массив рекапч
	    Asset::getInstance()->addString("<script>window.rc = {};
	 var divaCaptchaRender = function () {
		        $('.g-recaptcha').each(function() {
			          window.rc[$(this).attr('id')] = grecaptcha.render( this,{ 'sitekey': '" . DVS_RC_KEY . "', 'theme': 'light'} );
			});
		};
	</script>", true, AssetLocation::AFTER_JS);
	    define("DVS_RECAPTCHA", true);
	}

?>

Дальше мы можем обращаться из любого компонента к объекту рекапчи, которые находятся в массиве window.rc.

Вставка рекапчи:

<?php 
<div id="recaptchaUID" class="g-recaptcha"></div>
?>

Сброс рекапчи:

<?php 
<script>grecaptcha.reset(window.rc[recaptchaUID]);
</script>
?>

Тем самым не зная точно сколько рекапч будет на странице, мы можем работать с ними по идентификатору дива (в данном случае это recaptchaUID), в котором эта капча инициализировалась по классу g-recaptcha.