免费使用 Google 防注册机验证

「爱情、让人受尽委屈。」 2022-09-08 03:49 197阅读 0赞

# 准备 #

要有谷歌账户，去注册 [https://www.google.com/recaptcha/admin][https_www.google.com_recaptcha_admin]。我们使用 reCAPTCHA v3

填入你的域名，技巧：  
1、可多个域名存放在一个网站下（其实实际是不同网站也没关系）  
![在这里插入图片描述][watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_Q1NETiBAc3A0MmE_size_14_color_FFFFFF_t_70_g_se_x_16]  
2、添加 `localhost` 便于本地开发测试

# 使用 #

我们使用自定义用法。

## 引入脚本 ##

<style>.grecaptcha-badge{ display: none;}</style> 
    <script src="https://www.recaptcha.net/recaptcha/api.js?render=XXXX"></script>

`render` 参数是你的客户 appId，注意不是密钥。另外一个样式是隐藏 Google 标签的，自然大多数客户不想看到。

## beforeSubmit ##

一般来说要写入操作的表单都要验证一下（写入的操作）。我们在表单之前获取 Token 并作为参数传到后端，于是我们封装了一个小函数，其中 `GoogleReCAPTCHA_siteId` 就是客户 appId。

/** * 表单提交之前执行，获取 Token 并作为参数传到后端 * * @param {*} cb 提交表单的回调函数 */
    function googleReCAPTCHA(cb) { 
    	grecaptcha.ready(() => { 
    	    grecaptcha
    	    .execute(this.GoogleReCAPTCHA_siteId, {  action: "submit" })
    	    .then(cb);
    	});
    }

使用例子：

// 提交表单
    global.googleReCAPTCHA((token) => { 
      this.feedback.grecaptchaToken = token;// 注意这里加入 token 字段
    
      xhr.xhr_post("/api/feedback", 
    	(j) => { 
    	  console.log(j);
    	  if (j.isOk)
    	    this.$Message.success("提交成功！");
    	  else
    	    this.$Message.fail("提交错误！");
    	},
    	xhr.toParams(this.feedback)
      );
    });

## 服务端处理 ##

后端就是把传入的 token 再请求 Google 校验是否合法。下面给一个 Java 的例子，大致思路如此。

public boolean check(String token) { 
    	if (!cfg.isEnable())
    		return true;
    
    	if (!StringUtils.hasText(token))
    		throw new IllegalArgumentException("非法攻击！客户端缺少必要的参数");
    
    	Map<String, Object> map = Post.api(SITE_VERIFY, String.format("secret=%s&response=%s", cfg.getAccessSecret(), token.trim()));
    
    	if (map == null)
    		throw new IllegalAccessError("谷歌验证码服务失效，请联系技术人员");
    
    	if ((boolean) map.get("success")) // 判断用户输入的验证码是否通过
    		return true;
    	else { 
    		if ("timeout-or-duplicate".equals(map.get("error-codes")))
    			throw new NullPointerException("验证码已经过期，请刷新");
    
    		throw new IllegalAccessError("验证码不正确");
    	}
    }

POST 请求 `Post.api(SITE_VERIFY, String.format("secret=%s&response=%s", cfg.getAccessSecret(), token.trim()));`，输入 Token 和密钥两个参数发出去进行校验。然后根据返回的结果是否进行数据的提交，即 SQL 等的保存工作。

# 小结 #

Google reCaptcha 挺不错的，无感知验证，不需要用户输入验证码。但实际还是要根据评分再作出判断。参考：

*  [https://baijiahao.baidu.com/s?id=1616275069549421082&wfr=spider&for=pc][https_baijiahao.baidu.com_s_id_1616275069549421082_wfr_spider_for_pc]
 *  [https://springboot.io/t/topic/1424][https_springboot.io_t_topic_1424]

[https_www.google.com_recaptcha_admin]: https://www.google.com/recaptcha/admin
[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_Q1NETiBAc3A0MmE_size_14_color_FFFFFF_t_70_g_se_x_16]: /images/20220829/74325b55330f4a508b3a298952db902a.png
[https_baijiahao.baidu.com_s_id_1616275069549421082_wfr_spider_for_pc]: https://baijiahao.baidu.com/s?id=1616275069549421082&wfr=spider&for=pc
[https_springboot.io_t_topic_1424]: https://springboot.io/t/topic/1424