DreamWeaver制作的HTML表单中reCAPTCHA v2失效问题求助

问题1：无需点击reCAPTCHA验证框即可提交表单 #

这是因为前端未做提交拦截校验，且后端未验证reCAPTCHA响应令牌，导致表单可绕过验证直接提交。需从前后端同时修复：

前端校验（辅助拦截） #

给表单添加提交事件监听，校验reCAPTCHA是否完成验证：

<form id="contactForm" action="submit-handler.php" method="POST">
  <!-- 你的表单字段（姓名、邮箱、消息等） -->
  <div class="g-recaptcha" data-sitekey="你的站点密钥"></div>
  <button type="submit">提交</button>
</form>

<script>
document.getElementById('contactForm').addEventListener('submit', function(e) {
  const recaptchaToken = grecaptcha.getResponse();
  if (!recaptchaToken) {
    e.preventDefault();
    alert('请完成reCAPTCHA人机验证');
  }
});
</script>

后端验证（核心防护） #

前端校验仅能拦截普通用户，必须在后端调用Google的reCAPTCHA验证API确认令牌有效性。以PHP为例：

<?php
header('Content-Type: text/html; charset=utf-8');

if ($_SERVER['REQUEST_METHOD'] === 'POST') {
  $secretKey = '你的reCAPTCHA密钥';
  $recaptchaToken = $_POST['g-recaptcha-response'] ?? '';

  $verifyUrl = 'https://www.google.com/recaptcha/api/siteverify';
  $postData = http_build_query([
    'secret' => $secretKey,
    'response' => $recaptchaToken,
    'remoteip' => $_SERVER['REMOTE_ADDR']
  ]);

  $context = stream_context_create([
    'http' => [
      'method' => 'POST',
      'header' => 'Content-Type: application/x-www-form-urlencoded',
      'content' => $postData
    ]
  ]);

  $verifyResult = json_decode(file_get_contents($verifyUrl, false, $context), true);

  if (!$verifyResult['success']) {
    die('人机验证失败，请重试');
  }

  // 验证通过后处理表单数据，不要将g-recaptcha-response作为用户内容处理
}
?>

问题2：提交后出现乱码字符提示 #

提示中的“乱码”实际是reCAPTCHA的响应令牌，出现该问题是因为后端错误地将该令牌当作用户输入内容输出展示。修复方法：

• 后端处理表单时，仅将g-recaptcha-response用于调用验证API，验证完成后不要将其包含在邮件内容、页面提示等用户可见内容中。
• 确保全站编码统一为UTF-8：
  • HTML页面头部添加<meta charset="UTF-8">
  • 后端脚本开头设置编码（如PHP的header('Content-Type: text/html; charset=utf-8');）

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