在Vue项目中使用reCAPTCHA人机验证服务
前段时间培训的时候无意间看到了Google提供的免费人机验证服务reCAPTCHA，学习了一下就接入到我的Vue实践项目中。下面就介绍一下我的接入过程和踩过的坑。reCAPTCHAv2首先，需要在./public/index.html中添加如下代码：这里需要说明一下，国内请把www.google.com换成www.recaptcha.net:点击checkbox验证一个vue组件的创建，完整代码如下：
/template>描述：data(){return{sitekey:"6LeIxAcTAAAAAJcZVRqyHh71UMIEGNQ_MXjiZKhI"}},这个sitekey为了测试特殊密钥，需要注册自己的sitekey，在生产环境使用，注册地址（科学上网）：https://www.google.com/recaptcha/admin/create注册成功后，您将获得两个密钥：第一个密钥是站点密钥。setTimeout(()=>{window.grecaptcha.render("grecaptcha",{sitekey:this.sitekey,callback:this.submit});},200);grecaptcha的渲染接口，延迟200ms避免以下错误：this.submit是一个回调函数，接收返回的token用于后端验证。除了sitekey和callback之外，还有其他的参数，详见：这里只是把接收到的token传给后台。this.axios.get("http://localhost:3000/login",{params:{token:token}}).then(function(response){console.log(response);}).catch(function(错误）{console.log（错误）；}）；后端验证letres=awaitaxios.get("https://recaptcha.net/recaptcha/api/siteverify",{params:{secret:"6LdFp74UXXXXXXXXXXXXXXXXXXXX-XXXXXXXXXXXXXXXX",response:ctx.query.token}});ctx.body=res.data;参数：secret为获取到的第二个keyresponse为接收到的token返回：success：true表示验证通过。（写于2019年11月）
