Gof*_*ord 12 javascript html5 recaptcha
从我理解的文档中,为了改变recaptcha的语言,我必须明确地呈现它.
然而,问题在于它并没有真正出现,onload
甚至没有被调用.
当我尝试自动渲染它时,它确实有效.
这是代码:
在HTML头中:(我也尝试将它放在body标签的末尾)
<script src="https://www.google.com/recaptcha/api.js?onload=recaptchaCallback&render=explicit&hl=iw" async defer></script>
Run Code Online (Sandbox Code Playgroud)
在HTML表单中:
<div id="recaptcha"></div>
Run Code Online (Sandbox Code Playgroud)
使用Javascript:
var recaptchaCallback = function() {
console.log('recaptcha is ready'); // not showing
grecaptcha.render("recaptcha", {
sitekey: 'My Site Key',
callback: function() {
console.log('recaptcha callback');
}
});
}
Run Code Online (Sandbox Code Playgroud)
Aar*_*ron 17
确保在recaptcha脚本之前定义了onload方法.否则,您将遇到竞争条件,其中recaptcha脚本可能会在定义之前尝试调用您的方法(特别是如果缓存了重新访问脚本).
来自onload的文档https://developers.google.com/recaptcha/docs/display
注意:必须在加载reCAPTCHA API之前定义onload回调函数.确保没有竞争条件:
- 首先使用回调对脚本进行排序,然后再使用reCAPTCHA
- 在脚本标记中使用async和defer参数
例如:
<div id="recaptcha"></div>
<script type="text/javascript">
var recaptchaCallback = function () {
console.log('recaptcha is ready'); // not showing
grecaptcha.render("recaptcha", {
sitekey: 'SITE_KEY',
callback: function () {
console.log('recaptcha callback');
}
});
}
</script>
<script src="https://www.google.com/recaptcha/api.js?onload=recaptchaCallback&render=explicit&hl=iw" async defer></script>
Run Code Online (Sandbox Code Playgroud)
Raa*_*aad 10
我刚刚复制了你的代码,使用了我自己的Site Key,它确实有效.
我使用的代码是:
<html>
<body>
<p>ReCaptcha Test</p>
<div id="recaptcha"></div>
<script src="https://www.google.com/recaptcha/api.js?onload=recaptchaCallback&render=explicit&hl=iw" async defer></script>
<script type="text/javascript">
var recaptchaCallback = function () {
console.log('recaptcha is ready'); // showing
grecaptcha.render("recaptcha", {
sitekey: 'SITE_KEY',
callback: function () {
console.log('recaptcha callback');
}
});
}
</script>
</body>
</html>
Run Code Online (Sandbox Code Playgroud)
仔细检查您的代码,因为只有一个字符错误可以阻止工作.
归档时间: |
|
查看次数: |
26874 次 |
最近记录: |