Uncaught ReferenceError: Recaptcha ist nicht definiert

Habe ich ein Problem mit der Umsetzung der reCaptcha-Steuerelement auf ein Kontaktformular.

Den folgenden Fehler geworfen wird geladen: Uncaught ReferenceError: Recaptcha ist nicht definiert

Hier ist ein partieller Ausschnitt der code, den ich verwende:

<form role="form" id="ContactMessageForm">
    <div class="form-group">
        <div id="CaptchaContainer"></div>
    </div>
    <button type="button" class="btn btn-default" id="ContactMessageSendButton">Send</button>
</form>

<script type="text/javascript" src="/scripts/mail.min.js" defer="defer"></script>
<script type="text/javascript" src="http://www.google.com/recaptcha/api/js/recaptcha_ajax.js"></script>
<script type="text/javascript">
    $(document).ready(function () { 
        /* Initialize reCaptcha Control */
        Recaptcha.destroy();
        Recaptcha.create('6Lc4V_ASAAAAAMnnwUcaTewH1mlOdylMgAyxb_m6', 'CaptchaContainer', {
            theme: 'clean',
            callback: Recaptcha.focus_response_field
        });
    });
</script>

Ist wahrscheinlich ein Tippfehler in meinem code, aber ich bin nicht es zu sehen.

Sehen Sie die aktuellen Fehlers gefeuert: http://eat-sleep-code.com/#!/Kontakt

Wie es scheint ein timing-problem zwischen Ihrem HTML-code laden (Formular+Skript) und der Ausführung der $(document).ready (), die sich vor dem recaptcha-load-Ereignis.
Nicht sicher, ob ich Folgen. Da das Recaptcha.create-Aufruf wird innerhalb der $(document).ready(), es sollte nicht das Feuer, bis das Formular und Skript fertig ist laden.
Sie sind bereits laden die "Kontakt" - Inhalt in ein $(document).ready() im Rendern.js/renderContent(), so dass jedes andere Dokument.ready() werden sofort.
Wow, etwas neues gelernt. Also, was tun Sie denken wäre der beste Weg, damit umzugehen. Sollte sollte ich wickeln Sie es in ein setTimeout und überprüfen, um zu sehen, ob Recaptcha definiert ist?
setTimeout arbeiten konnte, manchmal, wenn Sie lange genug warten und es ist kein problem auf google Seite... ich bin mir nicht sicher, was ist die beste option. Ich würde vielleicht hinzufügen, einen patch, Rendern, um zu überprüfen, für die 'contact' in der Lage.hash, dann fügen Sie die google recaptcha script mit dem Dokument.createElement('script'), und überprüfen Sie .onload-Ereignis starten Verwendung von Recaptcha Objekt.

InformationsquelleAutor eat-sleep-code | 2014-03-20

  1. 2

    Ich hatte das gleiche problem und habe es behoben mit folgenden

    <script type="text/javascript">
    $.getScript( "http://www.google.com/recaptcha/api/js/recaptcha_ajax.js", function() {
        Recaptcha.create("<PUBLIC_KEY>", "recaptchadiv", {theme: "clean"});
    });
</script>

    InformationsquelleAutor dariush

  2. 0

    Über das feedback von @progysm zog ich den Aufruf recaptcha_ajax.js so, dass es geladen wurde, bevor die renderContent () - Funktion aufgerufen wurde. Dies erlaubt den Captcha-Bild angezeigt werden.

    Leider landete ich mit auf Sie zu verzichten reCaptcha Steuerung für diese Anwendung, als die Validierung der Methoden wurden blockiert durch cross-site-scripting-Methoden.

    InformationsquelleAutor eat-sleep-code

  3. 0

    Bitte bestätigen Sie, wenn Sie in den richtigen öffentlichen Schlüssel und nicht den privaten Schlüssel wie folgt

    Recaptcha.create('<public_key>', 'CaptchaContainer', {
        theme: 'clean',
        callback: Recaptcha.focus_response_field
});

    InformationsquelleAutor A J

Schreibe einen Kommentar