Как подключить google recaptcha к форме?

Здравствуйте, мне нужно подключить к произвольной форме регистрации google recaptcha, вот ссылка:

https://www.google.com/recaptcha/intro/index.html

Посмотрел api на сайте гугла, но оно для меня не понятное. Может кто нибудь привести пример или объяснить как можно привязать рекапчу к форме, что бы она работала как нужно. Мне не нужно особых ее настроек(типа языка и прочего). Просто основной функционал капчи.

Добавить Комментарий

Сперва подключим скрипт капчи:

 function onwp_enqueue_frontend() {
 wp_enqueue_script('ha-recaptcha', 'https://www.google.com/recaptcha/api.js', array('jquery'), '1.0', true);
 }
 add_action('wp_enqueue_scripts', 'onwp_enqueue_frontend');
 

В нужное место вставим html:

 <div class="g-recaptcha" data-sitekey="ваш_код"></div>
 

Функция проверки:

 $recaptcha = $_POST['data']['g_recaptcha_response'];
 if (!empty($recaptcha)) {
 $google_url = "https://www.google.com/recaptcha/api/siteverify";
 $secret = 'ваш_код';
 $ip = $_SERVER['REMOTE_ADDR'];
 $url = $google_url . "?secret=" . $secret . "&response=" . $recaptcha . "&remoteip=" . $ip;
 $res = onwp_getCurlData($url);
 $res = json_decode($res, true);
 //reCaptcha введена
 if (empty($res['success'])) {
 // Ошибка, пожалуйста введи капчу заново
 } else {
// все успешно прошло
// выполняем ваши действия
}
 } else {
 // Ошибка, пожалуйста введи капчу заново
 }
 

функция выполняющая запрос:

 function onwp_getCurlData($url) {
 $curl = curl_init();
 curl_setopt($curl, CURLOPT_URL, $url);
 curl_setopt($curl, CURLOPT_RETURNTRANSFER, 1);
 curl_setopt($curl, CURLOPT_TIMEOUT, 10);
 curl_setopt($curl, CURLOPT_USERAGENT, "Mozilla/5.0 (Windows; U; Windows NT 6.1; en-US; rv:1.9.2.16) Gecko/20110319 Firefox/3.6.16");
 $curlData = curl_exec($curl);
 curl_close($curl);
 return $curlData;
 }
 

И на всякий случай, js для перезагрузки капчи:

grecaptcha.reset();
Добавить Комментарий

Изменить внешний вид:


<div class="g-recaptcha" style="transform:scale(0.77);-webkit-transform:scale(0.77);transform-origin:0 0;-webkit-transform-origin:0 0;"></div>

Добавить Комментарий

Добавить несколько recaptcha на одну страницу:

 <script src="https://www.google.com/recaptcha/api.js?onload=myCallBack&render=explicit" async defer></script>
 <script>
 var recaptcha1;
 var recaptcha2;
 var myCallBack = function() {
 //Render the recaptcha1 on the element with ID "recaptcha1"
 recaptcha1 = grecaptcha.render('recaptcha1', {
 'sitekey' : '6Lc_0f4SAAAAAF9ZA', //Replace this with your Site key
 'theme' : 'light'
 });
//Render the recaptcha2 on the element with ID "recaptcha2"
 recaptcha2 = grecaptcha.render('recaptcha2', {
 'sitekey' : '6Lc_0f4SAAAAAF9ZA', //Replace this with your Site key
 'theme' : 'dark'
 });
 };
 </script>
 
Добавить Комментарий

Ваш ответ

Размещая свой ответ, вы соглашаетесь с правилами сайта.