Question

我正在Web应用程序中设置invisible reCAPTCHA，但无法验证用户的响应。（即使我传递了正确的POST参数）

我正在通过在客户端调用grecaptcha.execute();来以编程方式调用挑战。然后使用recaptcha回调提交表单（registrationForm.submit();）

：

<div class="g-recaptcha"
  data-sitekey="SITE_KEY"
  data-callback="onSubmit"
  data-size="invisible">
</div>

现在，在阅读"Verifying the user's response"文档之后，我发现响应令牌已作为POST参数传递给g-recaptcha-response：

对于网络用户，您可以通过以下三种方式之一获取用户的响应令牌：

  用户在您的网站上提交表单时，
g-recaptcha-response POST参数

...

因此，我正在使用Fetch在服务器端向verification endpoint创建带有所需主体数据的POST请求：

verify(req, res, next) {
  const VERIFY_URL = "https://www.google.com/recaptcha/api/siteverify";

  return fetch(VERIFY_URL, {
    method: "POST",
    headers: { "Content-Type": "application/json" },
    body: JSON.stringify({
      secret:   process.env.RECAP_INVIS_SECRET_KEY,
      response: req.body['g-recaptcha-response'],
    }),
  })
  .then(response => response.json())
  .then(data => {
    res.locals.recaptcha = data;
    return next();
  });
}

但我不断收到以下答复：

{ 成功：错误，错误代码：['missing-input-response'，'missing-input-secret'] }

即使我在POST正文中将响应和秘密作为JSON数据传递。

我做错什么了吗？问候。

Answer 1

对reCaptcha Google forums进行了一些研究和挖掘，看来该端点仅接受默认的内容类型； application/x-www-form-urlencoded。

这意味着您应该不使用JSON发送响应令牌和站点密钥。而是按照application/x-www-form-urlencoded的定义发送值：

以这种内容类型提交的表单必须按以下方式编码：


控件名称和值被转义。空格字符用'+'替换，然后按[RFC1738]第2.2节中的描述转义保留字符：非字母数字字符替换为'％HH'，一个百分号和两个十六进制数字，分别表示该字符的ASCII码。字符。换行符表示为“ CR LF”对（即'％0D％0A'）。

控件名称/值以它们在文档中出现的顺序列出。名称与值之间用'='分隔，名称/值对之间由'＆'分隔。

因此，您有两种方法，一种是通过URL（查询字符串）传递POST参数，然后将其作为POST请求发送：

https://www.google.com/recaptcha/api/siteverify?secret=${SECRET_KEY}&response=${req.body['g-recaptcha-response']}

或手动将数据附加到主体，如下所示：

verify(req, res, next) {
  const VERIFY_URL = "https://www.google.com/recaptcha/api/siteverify";

  return fetch(VERIFY_URL, {
    method: "POST",
    headers: { "Content-Type": "application/x-www-form-urlencoded" },
    body: `secret=${SECRET_KEY}&response=${req.body['g-recaptcha-response']}`,
  })
  .then(response => response.json())
  .then(data => {
    res.locals.recaptcha = data;
    return next();
  });
}

Answer 2

扩展上面的 U-ways 答案（谢谢），如果您想保留 JS 对象结构而不是格式化内联参数，您可以使用 URLSearchParams 和 Object.entries：

const recaptchaBody = {
  secret: RECAPTCHA_SECRET,
  response: recaptchaResponse,
};

// Check recaptcha validity
fetch("https://www.google.com/recaptcha/api/siteverify", {
  method: "POST",
  headers: { "Content-Type": "application/x-www-form-urlencoded" },
  body: new URLSearchParams(Object.entries(recaptchaBody)).toString(),
})
.then((res) => res.json())
.then((data) => {
  // If it's not a success..
  if (!data?.success) {
    // ERROR
  }
});

reCAPTCHA-错误代码：验证用户的响应时（缺少关于POST的详细信息），“缺少输入响应”，“缺少输入秘密”

2 个答案: