it-swarm.com.de

Google REcaptcha wird nicht angezeigt

Ich habe folgendes in meinem <body>

<div class="g-recaptcha" data-sitekey="some-key (original is right)">

und das auf meinem <head>

<script src="//www.google.com/recaptcha/api.js"></script>

aber es wird nichts gezeigt, weder auf Firefox noch auf chrom ...

10
Fane

stellen Sie sicher, dass <script src="//www.google.com/recaptcha/api.js"></script> das Letzte ist, bevor Sie das head-Tag schließen

5
Andrei

Schlagen Sie einfach dieses Hindernis und in meinem Fall war es auf AngularJS zurückzuführen. Es ist nicht auf Angular beschränkt. Jede Bibliothek, die die Elemente nach dem Laden der Seite bindet, kann dazu führen, dass Google reCAPTCHA nicht angezeigt wird, da das Element zum Zeitpunkt der Ausführung von Google-Code nicht vorhanden ist.

Um dies zu lösen, machen Sie zuerst den Renderer explizit und geben Sie eine Funktion an, die ausgeführt wird, wenn reCAPTCHA geladen wird:

<script src='https://www.google.com/recaptcha/api.js?onload=recaptchaOnload&render=explicit' async defer></script>

Fügen Sie dem Container jetzt eine eindeutige ID hinzu, z.

<div id="recaptcha" class="g-recaptcha" data-sitekey="site key here"></div>

Warten Sie dann in der benutzerdefinierten Funktion, bis das Element tatsächlich vorhanden ist:

var _captchaTries = 0;
function recaptchaOnload() {
    _captchaTries++;
    if (_captchaTries > 9)
        return;
    if ($('.g-recaptcha').length > 0) {
        grecaptcha.render("recaptcha", {
            sitekey: 'site key here',
            callback: function() {
                console.log('recaptcha callback');
            }
        });
        return;
    }
    window.setTimeout(recaptchaOnload, 1000);
}

Dies wird 10 Sekunden lang fortgesetzt, bis das Element gefunden und das reCAPTCHA in das Element gerendert wird.

4
Shadow Wizard

Stellen Sie sicher, dass in Ihrem Browser keine Inhaltsblocker aktiviert sind, beispielsweise Ad-Block Plus oder uBlock Origin.

Deaktivieren Sie diese, aktualisieren Sie die Seite und senden Sie das Formular erneut.

0
crmpicco

Das Problem, das ich hatte, war, dass es die meiste Zeit angezeigt wurde, aber gelegentlich nicht und ich musste das Formular absenden (und die Bestätigung auslösen), damit es angezeigt wird. Durch das Hinzufügen von ?render=explicit zum Skript-Tag wurde es für mich behoben.

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

https://developers.google.com/recaptcha/docs/display#explicit_render

0
woolm110