PHP表单集成Google reCAPTCHA v3遇问题：点击按钮仅刷新无验证

前端核心修正 #

要避免按钮直接触发表单提交，必须调整按钮类型并手动绑定reCAPTCHA验证逻辑：

<form id="bookingForm" method="POST" action="">
  <!-- 你的表单字段 -->
  <input type="text" name="name" required>
  <input type="email" name="email" required>

  <!-- 隐藏字段存储reCAPTCHA验证token -->
  <input type="hidden" id="recaptchaToken" name="recaptcha_token">

  <!-- 将submit按钮改为普通button，防止直接提交 -->
  <button type="button" id="bookNowBtn">Book Now</button>
</form>

<!-- 引入reCAPTCHA v3脚本 -->
<script src="https://www.google.com/recaptcha/api.js?render=你的站点密钥"></script>
<script>
// 绑定按钮点击事件，触发reCAPTCHA验证
document.getElementById('bookNowBtn').addEventListener('click', function() {
  grecaptcha.ready(function() {
    // 执行reCAPTCHA验证，action参数需与后端一致
    grecaptcha.execute('你的站点密钥', {action: 'booking'}).then(function(token) {
      // 将验证token存入隐藏字段
      document.getElementById('recaptchaToken').value = token;
      // 验证通过后手动提交表单
      document.getElementById('bookingForm').submit();
    });
  });
});
</script>

后端PHP验证逻辑 #

表单提交后必须先验证reCAPTCHA token有效性，再处理业务逻辑：

<?php
if ($_SERVER['REQUEST_METHOD'] === 'POST') {
  // 获取前端传递的验证token
  $recaptchaToken = $_POST['recaptcha_token'] ?? '';
  $secretKey = '你的密钥';

  // 调用Google验证接口
  $verifyUrl = "https://www.google.com/recaptcha/api/siteverify?secret=$secretKey&response=$recaptchaToken";
  $response = file_get_contents($verifyUrl);
  $responseData = json_decode($response);

  // 验证通过条件：success为true、action匹配、分数达标（可根据需求调整阈值）
  if ($responseData->success && $responseData->action === 'booking' && $responseData->score >= 0.5) {
    // 这里编写表单处理逻辑（如存储数据、发送邮件等）
    echo '表单提交成功！';
  } else {
    // 验证失败处理
    echo '验证失败，请重试！';
  }
}
?>

常见问题排查 #

• 确认站点密钥、密钥与Google后台配置一致，且当前域名已加入允许列表
• 禁止使用type="submit"按钮，否则会跳过reCAPTCHA直接提交表单
• 检查reCAPTCHA脚本是否正确引入，render参数必须是你的站点密钥
• 确保回调函数未被其他JS代码覆盖，按钮点击事件正常绑定
• 后端验证时需保证action参数与前端execute方法中的值完全一致

内容的提问来源于stack exchange，提问作者abhinav