ReCAPTCHA 找不到用户提供的函数：myCallBack

Question

我正在尝试使用 ReCAPTCHA，但出现以下错误。

ReCAPTCHA 找不到用户提供的函数：myCallBack。

如何解决这个问题？

var verifyCallback3 = function(response) {
    if(response!=null){
        $("#rss").show();
    }
};

var myCallBack = function() {
    grecaptcha.render('html_element', {
        'sitekey' : '6sssfffffffffAAPfEI_RkbAlUuw5FA4p-kiGy5Nea',
        'callback' : verifyCallback3,
        'theme' : 'light',
        'type':'image'
    });
};

Answer 1

确保您的回调函数是在全局范围内定义的。由于某种原因，在生产中我的函数不在这个命名空间中。

除了：

function myCallback() { ... }

确保直接将其分配到全局空间中：

window.myCallback = myCallback;

您应该能够测试这是否是您的问题，我在 Javascript 控制台中输入函数名称并查看它是否已定义。

Answer 2

同样的事情也发生在我身上。我仔细检查了我的代码，一切都很好，但验证码未显示，并且在控制台中消息是“ReCAPTCHA 找不到用户提供的函数：myCallBack”，但最后我发现我的 JavaScript 代码was 在页面加载函数中。我刚刚从页面加载功能及其工作中将其推出。

Answer 3

在您的 recaptcha div 中，确保不要在数据回调中使用括号。

像这样

data-callback="yourCallback"

，而不是

data-callback="yourCallback();"

Answer 4

你必须放置你的脚本函数：

<script> function registerFormCheck()</script>

在谷歌脚本之前是这样的：

/* First */    <script> function registerFormCheck(){} </script>
/* Second */   <script src='https://www.google.com/recaptcha/api.js'></script>

这对我有用......

Answer 5

参考 John Lehmann 的 answer，对于 React 用户，为了使你的回调函数可见，请将其设为全局。

您可以通过使用

useEffect()

或

componentDidMount()

生命周期方法来实现这一点。

例如：

useEffect(() => {
    window.verifyCaptcha = verifyCaptcha;
})

这样，当包含 reCAPTCHA 框的组件加载时，它也会使您的回调函数成为全局的。

Answer 6

函数中的某处或 JavaScript 中的某处可能存在错误，导致函数无法注册，对我来说，这是缺少逗号。根据您所掌握的情况，我猜测它与“html_element”或未分配的 widgetID 有关。尝试：

var myCallBack = function() {
    var widgetID;
    widgetID = grecaptcha.render(document.getElementById('html_element'), {
        'sitekey' : '6sssfffffffffAAPfEI_RkbAlUuw5FA4p-kiGy5Nea',
        'callback' : verifyCallback3,
        'theme' : 'light',
        'type':'image'
    });
};

Answer 7

对于我来说这个解决方案：

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

Answer 8

在 Google 文档中的代码示例之一中，它们包含此脚本标记，但没有结束标记：

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

添加结束标签解决了我的问题：

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

Answer 9

有趣的事情：

更改此：

var verifyCallback3 = function(response) {
   if(response!=null){
       $("#rss").show();
   }
};

对此：

function verifyCallback3(response) {
   if(response!=null){
       $("#rss").show();
   }
};

为我成功了。

Answer 10

我遇到了同样的问题，并通过停用缓存插件解决了这些问题。由于缓存插件，此问题经常出现在 WordPress 网站中。停用缓存插件并检查。

谢谢你。