javascript 执行隐形验证码时出现“错误:无效的 ReCAPTCHA 客户端 ID”
声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow
原文地址: http://stackoverflow.com/questions/47371102/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
"Error: Invalid ReCAPTCHA client id" when executing an invisible captcha
提问by Kroltan
I'm trying to implement Google's Invisible reCAPTCHA in a HTML form in a Wordpress website.
我正在尝试在 Wordpress 网站的 HTML 表单中实现 Google 的 Invisible reCAPTCHA。
In the head
在里面 head
First, I have the script that sets up the callbacks and binds the submit event of the form to the verification:
首先,我有设置回调并将表单的提交事件绑定到验证的脚本:
jQuery(document).ready(function() {
var valid = false;
window.recaptchaOkay = function(token) {
valid = true;
jQuery('#cadastro').submit();
};
document.getElementById('cadastro').addEventListener('submit', function validate(event) {
if (valid) {
return true;
}
var cap = document
.getElementById('cadastro')
.querySelector('.g-recaptcha');
grecaptcha.execute(cap);
event.preventDefault();
return false;
});
});
Then, I load the reCAPTCHA script, precisely as indicated in the documentation:
然后,我按照文档中的说明加载 reCAPTCHA 脚本:
<script src="https://www.google.com/recaptcha/api.js" async defer></script>
In the body
在里面 body
And this is the form I'm using:
这是我正在使用的表格:
<form action="https://example.com/" method="post" id="cadastro">
<div
class="g-recaptcha"
data-sitekey="6Lc0jC4UAAAAANlXbqGWNlwyW_e1kEB89zLTfMer"
data-callback="recaptchaOkay"
data-size="invisible"
id="cadastro-captcha">
</div>
<button type="submit" id="cadastro-submit">Enviar</button>
</form>
What happens
怎么了
I fill the form, submit it, and the following error is thrown (in the line with grecaptcha.execute):
我填写了表格,提交了它,然后抛出了以下错误(与 一致grecaptcha.execute):
Error: Invalid ReCAPTCHA client id: [object HTMLDivElement]
Also tried just passing the cadastro-captchaID directly to that function as a string (e.g. grecaptcha.execute("cadastro-captcha")), yet the same error happens (bar the id being different, obviously). Equivalently, if I pass no argument, the same error happens, except it refers to undefined.
还尝试将cadastro-captchaID 作为字符串直接传递给该函数(例如grecaptcha.execute("cadastro-captcha")),但发生了相同的错误(显然,ID 不同)。等效地,如果我不传递任何参数,则会发生相同的错误,除了它引用undefined.
回答by Harveer Singh Aulakh
Try this one :--
试试这个:--
The grecaptcha.reset() method accepts an optional widget_id parameter, and defaults to the first widget created if unspecified. A widget_id is returned from the grecaptcha.render() method for each widget created. So you need to store this id, and use it to reset that specific widget:
grecaptcha.reset() 方法接受一个可选的 widget_id 参数,如果未指定,则默认为创建的第一个小部件。对于创建的每个小部件,从 grecaptcha.render() 方法返回一个小部件 ID。所以你需要存储这个 id,并用它来重置那个特定的小部件:
var widgetId = grecaptcha.render(container);
grecaptcha.reset(widgetId);
If More information then Read google recaptcha docs:-- https://developers.google.com/recaptcha/docs/display#js_api
如果有更多信息,请阅读谷歌 recaptcha 文档:-- https://developers.google.com/recaptcha/docs/display#js_api

