“错误:无效的 ReCAPTCHA 客户端 ID"执行隐形验证码时 [英] "Error: Invalid ReCAPTCHA client id" when executing an invisible captcha

查看:126
本文介绍了“错误:无效的 ReCAPTCHA 客户端 ID"执行隐形验证码时的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

我正在尝试在 Wordpress 网站的 HTML 表单中实现 Google 的 Invisible reCAPTCHA.

head

首先,我有设置回调并将表单的提交事件绑定到验证的脚本:

jQuery(document).ready(function() {var 有效 = 假;window.recaptchaOkay = 函数(令牌){有效 = 真;jQuery('#cadastro').提交();};document.getElementById('cadastro').addEventListener('submit', function validate(event) {如果(有效){返回真;}var cap = 文档.getElementById('cadastro').querySelector('.g-recaptcha');grecaptcha.execute(cap);event.preventDefault();返回假;});});

然后,我按照文档中的指示加载 reCAPTCHA 脚本:

<script src="https://www.google.com/recaptcha/api.js" 异步延迟></script>

body

这是我使用的表格:

<button type="submit" id="cadastro-submit">Enviar</button></表单>

发生了什么

我填写了表单,提交了,然后抛出了以下错误(在带有grecaptcha.execute的行中):

错误:无效的 ReCAPTCHA 客户端 ID:[object HTMLDivElement]

还尝试将 cadastro-captcha ID 作为字符串直接传递给该函数(例如 grecaptcha.execute("cadastro-captcha")),但结果相同发生错误(显然,ID 不同).等效地,如果我不传递任何参数,也会发生同样的错误,只是它引用了 undefined.

解决方案

试试这个 :--

grecaptcha.reset() 方法接受一个可选的 widget_id 参数,如果未指定,则默认为创建的第一个小部件.对于创建的每个小部件,从 grecaptcha.render() 方法返回一个小部件 ID.所以你需要存储这个 id,并用它来重置那个特定的小部件:

var widgetId = grecaptcha.render(container);grecaptcha.reset(widgetId);

如果有更多信息,请阅读谷歌验证码文档:--https://developers.google.com/recaptcha/docs/display#js_api

I'm trying to implement Google's Invisible reCAPTCHA in a HTML form in a Wordpress website.

In the 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:

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

In the 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):

Error: Invalid ReCAPTCHA client id: [object HTMLDivElement]

Also tried just passing the cadastro-captcha ID 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.

解决方案

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:

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 客户端 ID"执行隐形验证码时的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆