2015-05-15 25 views
10

Dalla documentazione ho capito che per cambiare la lingua del recaptcha devo renderlo esplicitamente.Rendering esplicito ReCaptcha - Funzione Onload non attiva

Il problema è, tuttavia, che non viene mostrato e lo onload non viene nemmeno chiamato.
Quando provo a renderlo automaticamente, funziona.

Ecco il codice:
Nella testa HTML: (ho anche provato a mettere questo alla fine del tag body)

<script src="https://www.google.com/recaptcha/api.js?onload=recaptchaCallback&render=explicit&hl=iw" async defer></script> 

Nella forma HTML:

<div id="recaptcha"></div> 

Javascript:

var recaptchaCallback = function() { 
    console.log('recaptcha is ready'); // not showing 
    grecaptcha.render("recaptcha", { 
    sitekey: 'My Site Key', 
    callback: function() { 
     console.log('recaptcha callback'); 
    } 
    }); 
} 
+0

Si potrebbe voler controllare il tag ''

14

Assicurarsi che il metodo onload sia definito prima dello script recaptcha. Altrimenti si avrà una condizione di competizione in cui lo script recaptcha potrebbe tentare di chiamare il metodo prima che sia definito (specialmente se lo script recaptcha è memorizzato nella cache).

Dalla documentazione per onload https://developers.google.com/recaptcha/docs/display

Nota: la funzione di callback onload deve essere definito prima i reCAPTCHA carichi API. Per garantire non ci sono le condizioni di gara:

  • ordine i propri script con la richiamata prima, e poi reCAPTCHA
  • utilizzare l'async e rinviare i parametri nei tag di script

Ad esempio:

<div id="recaptcha"></div> 


<script type="text/javascript"> 
    var recaptchaCallback = function() { 
    console.log('recaptcha is ready'); // not showing 
    grecaptcha.render("recaptcha", { 
     sitekey: 'SITE_KEY', 
     callback: function() { 
      console.log('recaptcha callback'); 
     } 
    }); 
    } 
</script> 

<script src="https://www.google.com/recaptcha/api.js?onload=recaptchaCallback&render=explicit&hl=iw" async defer></script> 
+2

Questa dovrebbe essere la risposta corretta – GusDeCooL

0

HTML

<div id="captcha"></div> 
<script src='https://www.google.com/recaptcha/api.js?onload=recaptchaReadycallback&render=explicit' async defer'></script> 

Javascript

 //render captcha and set call back function on api.js load finish 
     function recaptchaReadycallback(){ 
     grecaptcha.render('captcha', { 
      'callback' : recaptchaCheckedCallback, 
      'expired-callback': recaptchaExpiredCallback, 
      'sitekey': 'YOUR-SITE-KEY' 

     }); 
     } 

     //on expiry do stuff. i.e. show error 
     function recaptchaExpiredCallback(){ 
      grecaptcha.reset(); 
      //show 'check the bloody box' error 
     }; 

     //on not a robot confirmation do stuff. i.e. hide error 
     function recaptchaCheckedCallback(){ 
      //hide 'check the bloody box' error 
     }