2015-06-14 98 views
5

我已经在我的<body>谷歌验证码不显示

<div class="g-recaptcha" data-sitekey="some-key (original is right)"> 

并且在这之后我<head>

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

,但没有显示,无论是在Firefox或Chrome ......这是一个已知的问题?

+0

控制台中是否有脚本错误? – Ravimallya

回答

-3

变化:

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

到:

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

我不知道,如果这只是一个错字,如果不是,添加https:肯定会解决你的问题。

+1

'加入https:肯定能解决你的问题'没有什么明确的; '//www.google.com/...'是一个协议相关的URL。如果@ Fane的文档是通过“https”来源提供的,那么它将是相同的。 –

-2

我刚刚在一个系统上有更严格的浏览器设置。
添加*.gstatic.com到信任列表解决它

我还添加了*.google.com*.google-analytics.com

希望帮助别人

3

确保<script src="//www.google.com/recaptcha/api.js"></script>是头标记的结束前的最后一件事。 对我来说固定相同的问题

0

请确保您没有在浏览器中激活任何内容拦截器,例如Ad-Block Plus或uBlock来源。

禁用这些,刷新页面并再次提交表单。

1

只要按下这个障碍,并在我的情况下,它是由于AngularJS。它不仅限于Angular,在页面加载后绑定元素的任何库都可能导致Google reCAPTCHA无法显示,因为该元素在Google代码执行时并不存在。

为了解决这个问题,首先要渲染明确,并提供一个函数来执行时,验证码载荷:

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

现在,添加一个唯一的ID容器,例如

<div id="recaptcha" class="g-recaptcha" data-sitekey="site key here"></div> 

然后在自定义功能等元素,以实际存在:

var _captchaTries = 0; 
function recaptchaOnload() { 
    _captchaTries++; 
    if (_captchaTries > 9) 
     return; 
    if ($('.g-recaptcha').length > 0) { 
     grecaptcha.render("recaptcha", { 
      sitekey: 'site key here', 
      callback: function() { 
       console.log('recaptcha callback'); 
      } 
     }); 
     return; 
    } 
    window.setTimeout(recaptchaOnload, 1000); 
} 

这将继续努力,持续10秒,直到它找到的元素,然后渲染的reCAPTCHA进去。