同一頁面中有多個Google Recaptchas

我在這裏遇到了問題，我在我的頁面上包含了2個recaptchas，並且他們正在正常工作，但是在清理它們時（在通過ajax提交後）我無法重置recaptcha ，如果我使用「grecaptcha.reset」，它只能擦除一個回形針。謝謝！同一頁面中有多個Google Recaptchas

來源

2017-04-01 Alexandre

爲什麼有兩個在第一個地方？ –

因爲我在同一頁面中有兩種形式：與我們和聯繫人一起工作。 – Alexandre

嘗試將驗證碼ID添加到數組，然後重置該數組中的每一個？ – Allen

這是我簡單的解決方案，這樣你可以準備儘可能多的驗證碼，因爲你需要在同一頁面上。記得把谷歌API的元素：SiteKey和SecretKey！

後端：

<?php 

$siteKey = 'Paste element provided by google api'; 
$secretKey = 'Paste element provided by google api'; 

if($_POST['submit']){ 

    $username = $_POST['username']; 
    $responseKey = $_POST['g-recaptcha-response']; 
    $userIP = $_SERVER['REMOTE_ADDR']; 
    $url = "https://www.google.com/recaptcha/api/siteverify?secret=$secretKey&response=$responseKey&remoteip=$userIP"; 
    $response = file_get_contents($url); 
    $response = json_decode($response); 
    if($response->success){ 
     echo "Verification is correct. Your name is $username"; 
    } else { 
     echo "Verification failed"; 
    } 
}?>

而且前端：

<html> 
<meta> 
    <title>Google ReCaptcha</title> 
</meta> 
<body> 
    <h3>First form</h3> 
    <form action="index.php" method="post"> 
     <input type="text" name="username" placeholder="Write your name"/> 
     <div id="recaptcha1"></div> 
     <input type="submit" name="submit" value="send"/> 
    </form> 


    <h3>Second form</h3> 
    <form action="index.php" method="post"> 
     <input type="text" name="username" placeholder="Write your name"/> 
     <div id="recaptcha2"></div> 
     <input type="submit" name="submit" value="send"/> 
    </form> 


    <script src="https://www.google.com/recaptcha/api.js?onload=myCallBack&render=explicit" async defer></script> 
    <script> 
     var recaptcha1; 
     var recaptcha2; 
     var myCallBack = function() { 

      recaptcha1 = grecaptcha.render('recaptcha1', { 
       'sitekey' : '<?= $siteKey ?>', 
       'theme' : 'light' 
      }); 

      recaptcha2 = grecaptcha.render('recaptcha2', { 
       'sitekey' : '<?= $siteKey ?>', 
       'theme' : 'dark' 
      }); 
     }; 
    </script> 
</body>

乾杯！

來源

2017-06-05 13:52:03

同一頁面中有多個Google Recaptchas

回答

相關問題