Recaptcha 渲染不清楚答案

【问题标题】：Recaptch rendering unclearRecaptcha 渲染不清楚
【发布时间】：2015-01-08 22:20:25
【问题描述】：

我正在尝试在我的项目中实现 reCaptcha，但我遇到了一些问题。

每当我从 Chrome 浏览一个带有 reCaptcha 的网站时，我都会看到一个奇怪的界面，要求我填写一些（非常）难以识别的随机字母，当我最终正确识别它们时，我会得到一些非常长的代码应该粘贴到第二个输入中。

现在，如果我从 Internet Explorer 浏览到同一个网站，我会看到这个很酷的复选框，没有字母，一切正常。

来自 Google 的 URL 缩短器 (Chrome) 的示例：

同样，在 Internet Explorer 上：

是什么导致了这种行为？

【问题讨论】：

这些都是recaptcha（它们共享相同的图标）。 Recaptcha 正在决定使用哪种方法来验证您不是机器人。我认为没有办法强制执行此操作。谷歌正试图过渡到更新的、单一的复选框方法。 google.com/recaptcha/intro/index.html
但是为什么这在同一台 PC 上的工作方式不同呢？我真的更喜欢使用 chrome，我网站的用户也是如此..
它读取不同的线索来决定你得到什么形式的验证码。我大多听说过它如何处理鼠标悬停事件以确定是人拿着鼠标还是计算机以编程方式单击鼠标。除了该指标之外，它还可能使用代理字符串或 IP 地址来帮助选择方法。这纯粹是猜想，但它似乎确实是一个复杂的过程，recaptcha 决定如何对用户进行身份验证。
渲染在加载时立即发生，它不可能根据用户交互事件决定渲染什么，因为没有任何事件。还试图在 Chrome 中欺骗 IE 的用户代理，仍然得到了上面提到的奇怪的 reCaptcha。

标签： google-chrome internet-explorer captcha recaptcha

【解决方案1】：

我猜你的 reCaptcha 是自动渲染的，而不是显式渲染它。

如果您想要一致性，请尝试显式渲染 reCaptcha 并将 grecaptcha.render 参数 'type' 设置为 'image'

<html>

<head>
  <title>reCAPTCHA demo: Explicit render after an onload callback</title>
  <script type="text/javascript">
    var onloadCallback = function() {
      grecaptcha.render('html_element', {
        'sitekey': 'your_site_key',
        'type': 'image'
      });
    };
  </script>
</head>

<body>
  <form action="?" method="POST">
    <div id="html_element"></div>
    <br>
    <input type="submit" value="Submit">
  </form>
  <script src="https://www.google.com/recaptcha/api.js?onload=onloadCallback&render=explicit" async defer></script>
</body>

</html>

【讨论】：

【解决方案2】：

啊，发现问题了，现在觉得有点傻。

在使用 Fiddler 检查和比较我在 Chrome 和 Internet Explorer 上的页面加载流程后，我注意到了一些差异，这些差异可以追溯到这个名为“Disconnect”的讨厌的 Chrome 扩展程序。删除它，解决了我的问题。

不管怎样，谢谢你们的帮助。

【讨论】：

由于解决方案的性质，这个问题可能应该被删除。不过，解决这个问题的工作很好 - 提琴手来救援！