谷歌验证码 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随表单提交到后端进行校验

发表评论

您的电子邮箱地址不会被公开。 必填项已用*标注