Ich habe folgendes in meinem <body>Google reCAPTCHA zeigt nicht
<div class="g-recaptcha" data-sitekey="some-key (original is right)">
und diese auf meinem <head>
<script src="//www.google.com/recaptcha/api.js"></script>
aber nichts angezeigt wird, entweder auf Firefox oder Chrom ... Ist das ein bekannter Problem?
Wechsel:
<script src="//www.google.com/recaptcha/api.js"></script>
zu:
<script src="https://www.google.com/recaptcha/api.js" async defer></script>
Ich weiß nicht, ob das ist nur ein Tippfehler, wenn dies nicht der Fall, das Hinzufügen der https: würde auf jeden Fall Ihr Problem lösen.
'addieren die https: würde definitiv dein Problem lösen' Es gibt kein definitives darüber; '//www.google.com/...' ist eine protokollrelative URL. Wenn das @ Fane-Dokument von einer https-Quelle stammt, wäre es identisch. –
Ich hatte gerade dies auf einem System, das strengere Browsereinstellungen hat.
*.gstatic.com in die Liste vertrauenswürdiger Hinzufügen aufgelöst es
Ich habe auch *.google.com und *.google-analytics.com
Hoffnung, dass jemand
sicher hilft, dass <script src="//www.google.com/recaptcha/api.js"></script> das letzte, was vor dem Schließen des Head-Tag ist. Das gleiche Problem für mich behoben
Stellen Sie sicher, dass Sie keine Inhaltsblocker in Ihrem Browser aktiviert haben, zum Beispiel Ad-Block Plus oder uBlock Herkunft.
Deaktivieren Sie diese, aktualisieren Sie die Seite und senden Sie das Formular erneut ab.
Das Problem, das ich hatte, war, dass es die meiste Zeit zeigte, aber gelegentlich würde es nicht und ich würde das Formular einreichen müssen (und Bestätigung auslösen), damit es zeigt. Hinzufügen von ?render=explicit zum Skript-Tag repariert es für mich.
<script src="https://www.google.com/recaptcha/api.js?render=explicit" async defer></script>
https://developers.google.com/recaptcha/docs/display#explicit_render
Gerade dieses Hindernis getroffen, und in meinem Fall war es zu AngularJS fällig. Es ist nicht auf Angular beschränkt. Eine 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 des Google-Codes noch nicht existiert.
Um dies zu lösen, zuerst die expliziten machen machen und eine Funktion auszuführen liefern, wenn die Lasten reCAPTCHA:
<script src='https://www.google.com/recaptcha/api.js?onload=recaptchaOnload&render=explicit' async defer></script>
nun eine eindeutige ID zu dem Behälter hinzuzufügen, zum Beispiel
<div id="recaptcha" class="g-recaptcha" data-sitekey="site key here"></div>
dann in der benutzerdefinierten Funktion für das Element warten, bis tatsächlich existiert:
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 immer wieder versuchen, bis es das Element findet, dann macht die reCAPTCHA hinein.
Gibt es Skriptfehler in der Konsole? – Ravimallya