不可见的 reCAPTCHA - 缺少必需的参数:sitekey
Invisible reCAPTCHA - Missing required parameters: sitekey
我正在为每个带有 class g-recaptcha
按钮的表单动态加载 Invisible reCAPTCHA。
我遇到的问题是验证码加载不正确,我不确定为什么。我遵循了验证码网站上的文档,但我不确定我是如何以及为什么会收到此错误的:
Uncaught Error: Missing required parameters: sitekey
有人知道问题出在哪里吗?
这是我使用的代码:
<script src='https://www.google.com/recaptcha/api.js?onload=onloadCallback&hl={{ app.request.locale|default(defaultLang) }}' async defer></script>
JS
var onloadCallback = function () {
$("button.g-recaptcha").each(function () {
var el = $(this);
//SITE_KEY is actually hard coded string.
//It is string that google provided. I just remove it for security reasons...
grecaptcha.render($(el).attr("id"), {
"sitekey": SITE_KEY,
"size": "invisible",
"badge": "inline",
"callback": function (token) {
$(el).parent().find(".g-recaptcha-response").val(token);
$(el).closest("form").submit();
}
}, true);
});
$("button.g-recaptcha").click(function(event) {
event.preventDefault();
grecaptcha.execute();
});
};
HTML 的示例:
<button
type="submit"
id="submitReviewButton"
class="btn btn-lg btn-submit btn--green g-recaptcha"
>
{{ "review.submit_your_review"|trans }}
</button>
您在这里遗漏了一个重要的部分。 api 小部件必须显式呈现。只需将 render=explicit
添加到 recaptcha api 脚本。
<script src='https://www.google.com/recaptcha/api.js?
onload=onloadCallback
&render=explicit
&hl={{app.request.locale|default(defaultLang) }}' async defer>
</script>
阅读 Google 文档 (reCAPTCHA V2 | reCAPTCHA - Explicitly render the reCAPTCHA widget)。
如果您在将 Wordpress 与 CForm Builder 和 Google Captcha RECaptcha 一起使用时得到 "Missing required parameters: sitekey",则必须将 Recaptcha 站点密钥放在左侧导航栏的 "Global Options" 下,以便CForm Builder 插件。您还需要 Google 验证码插件中的相同信息。这可能看起来很明显,但我很长时间都错过了 CForm "Global Options"。
如果您来这里只是为了工作 Recaptcha Invisible v2 代码示例:
1. 把 id="recaptcha" 放在你的表单按钮上
2.添加JavaScript
var recaptchaCallback = function() {
$("button#recaptcha").each(function () {
var el = $(this);
grecaptcha.render($(el).attr("id"), {
"sitekey": 'YOUR_GOOGLE_RECAPTCHA_KEY',
"size": "invisible",
"badge": "bottomleft",
"callback": function (token) {
$(el).closest("form").submit();
}
});
});
};
</script>
<script src="https://www.google.com/recaptcha/api.js?onload=recaptchaCallback&render=explicit" async defer></script>
我正在为每个带有 class g-recaptcha
按钮的表单动态加载 Invisible reCAPTCHA。
我遇到的问题是验证码加载不正确,我不确定为什么。我遵循了验证码网站上的文档,但我不确定我是如何以及为什么会收到此错误的:
Uncaught Error: Missing required parameters: sitekey
有人知道问题出在哪里吗?
这是我使用的代码:
<script src='https://www.google.com/recaptcha/api.js?onload=onloadCallback&hl={{ app.request.locale|default(defaultLang) }}' async defer></script>
JS
var onloadCallback = function () {
$("button.g-recaptcha").each(function () {
var el = $(this);
//SITE_KEY is actually hard coded string.
//It is string that google provided. I just remove it for security reasons...
grecaptcha.render($(el).attr("id"), {
"sitekey": SITE_KEY,
"size": "invisible",
"badge": "inline",
"callback": function (token) {
$(el).parent().find(".g-recaptcha-response").val(token);
$(el).closest("form").submit();
}
}, true);
});
$("button.g-recaptcha").click(function(event) {
event.preventDefault();
grecaptcha.execute();
});
};
HTML 的示例:
<button
type="submit"
id="submitReviewButton"
class="btn btn-lg btn-submit btn--green g-recaptcha"
>
{{ "review.submit_your_review"|trans }}
</button>
您在这里遗漏了一个重要的部分。 api 小部件必须显式呈现。只需将 render=explicit
添加到 recaptcha api 脚本。
<script src='https://www.google.com/recaptcha/api.js?
onload=onloadCallback
&render=explicit
&hl={{app.request.locale|default(defaultLang) }}' async defer>
</script>
阅读 Google 文档 (reCAPTCHA V2 | reCAPTCHA - Explicitly render the reCAPTCHA widget)。
如果您在将 Wordpress 与 CForm Builder 和 Google Captcha RECaptcha 一起使用时得到 "Missing required parameters: sitekey",则必须将 Recaptcha 站点密钥放在左侧导航栏的 "Global Options" 下,以便CForm Builder 插件。您还需要 Google 验证码插件中的相同信息。这可能看起来很明显,但我很长时间都错过了 CForm "Global Options"。
如果您来这里只是为了工作 Recaptcha Invisible v2 代码示例:
1. 把 id="recaptcha" 放在你的表单按钮上
2.添加JavaScript
var recaptchaCallback = function() {
$("button#recaptcha").each(function () {
var el = $(this);
grecaptcha.render($(el).attr("id"), {
"sitekey": 'YOUR_GOOGLE_RECAPTCHA_KEY',
"size": "invisible",
"badge": "bottomleft",
"callback": function (token) {
$(el).closest("form").submit();
}
});
});
};
</script>
<script src="https://www.google.com/recaptcha/api.js?onload=recaptchaCallback&render=explicit" async defer></script>