reCAPTCHA v3 会返回每个请求的得分,而不会让用户感到卡顿。该得分根据与您网站的互动情况得出,使您能够对网站采取适当的措施。在 reCAPTCHA 管理控制台中注册 reCAPTCHA v3 密钥。
本页介绍了如何启用和自定义 reCAPTCHA v3。
放置到网站上
reCAPTCHA v3 永远不会干扰您的用户,因此您可以随时运行它,而不会影响转化。reCAPTCHA 拥有与网站互动相关(因看到合法行为和滥用行为)后所取得的效果最好。因此,我们建议您在表单或操作中以及网页的背景中加入 reCAPTCHA 验证,以进行分析。
您可以在同一页面上对任意多个操作执行 reCAPTCHA。
自动将挑战绑定到按钮
要在网页上使用 reCAPTCHA v3,最简单的方法是添加必要的 JavaScript 资源,并向 HTML 按钮添加一些属性。
加载 JavaScript API。
<script src="https://www.google.com/recaptcha/api.js"></script>
添加一个回调函数来处理令牌。
<script> function onSubmit(token) { document.getElementById("demo-form").submit(); } </script>
向您的 html 按钮添加属性。
<button class="g-recaptcha" data-sitekey="reCAPTCHA_site_key" data-callback='onSubmit' data-action='submit'>Submit</button>
以编程方式调用验证方式
如果您希望更好地控制 reCAPTCHA 的运行时间,可以在 grecaptcha
对象中使用 execute
方法。为此,您需要在 reCAPTCHA 脚本加载中添加 render
参数。
使用您的网站密钥加载 JavaScript API。
<script src="https://www.google.com/recaptcha/api.js?render=reCAPTCHA_site_key"></script>
针对您要保护的每项操作调用
grecaptcha.execute
。<script> function onClick(e) { e.preventDefault(); grecaptcha.ready(function() { grecaptcha.execute('reCAPTCHA_site_key', {action: 'submit'}).then(function(token) { // Add your logic to submit to your backend server here. }); }); } </script>
使用验证请求立即将令牌发送到后端。
解读得分
reCAPTCHA v3 会返回一个得分(1.0 表示很可能是完全正常的互动,0.0 表示很可能是漫游器)。 您可以根据该得分针对网站环境采取可变措施。网站各有不同,但您可以参考下面几个示例,了解网站如何使用得分。如下面的示例所示,您可以在后台采取措施,而不是阻止流量,以更好地保护您的网站。
用例 | 建议 |
---|---|
首页 | 在过滤抄袭者的同时,在管理控制台中集中查看流量。 |
login | 如果得分较低,可要求双重验证或电子邮件验证,以防止凭据填充攻击。 |
social | 限制来自滥用用户的尚未回应的好友请求;发送有风险的评论以进行审核。 |
电子商务 | 避免漫游器接触到您的真实销售交易,并识别有风险的交易。 |
reCAPTCHA 通过查看您网站上的实际流量来学习。因此,预演环境中或实现后不久的得分可能与生产环境不同。由于 reCAPTCHA v3 不会干扰用户流,您可以先运行 reCAPTCHA 而不采取措施,然后在管理控制台中查看流量来确定阈值。默认情况下,您可以使用阈值 0.5。
操作
reCAPTCHA v3 引入了一个新概念:操作。在执行 reCAPTCHA 的每个位置指定操作名称时,您可以启用以下新功能:
- 在管理控制台中显示您的前 10 项热门操作的详细数据细分
- 根据操作上下文进行自适应风险分析,因为滥用行为可能有所不同。
重要的是,在验证 reCAPTCHA 响应时,您应验证操作名称是否是您预期的名称。
网站验证响应
发出验证响应令牌的请求,与 reCAPTCHA v2 或隐形 reCAPTCHA 一样。
响应是一个 JSON 对象:
{
"success": true|false, // whether this request was a valid reCAPTCHA token for your site
"score": number // the score for this request (0.0 - 1.0)
"action": string // the action name for this request (important to verify)
"challenge_ts": timestamp, // timestamp of the challenge load (ISO format yyyy-MM-dd'T'HH:mm:ssZZ)
"hostname": string, // the hostname of the site where the reCAPTCHA was solved
"error-codes": [...] // optional
}