谷歌验证码 ReCAPTCHA HTML前端配置

在前端HTML中导入ReCAPTCHA的api

<script src="https://recaptcha.net/recaptcha/api.js?onload=reCaptchaOnLoadCallback" async defer></script>

然后在需要验证码的位置添加验证码框 （把{SITE_KEY}替换成你自己的KEY）

<div id="g-recaptcha-box" style="margin: auto" class="g-recaptcha" data-callback="" data-sitekey="{SITE_KEY}"></div>

在JavaScript获取验证后的响应信息

//获取recaptcha的response
let response = grecaptcha.getResponse()
if (response === "") {
    //如果response为空，则抖动人机验证框进行提示
    //TODO 抖动效果
}

将response随表单提交到后端进行校验