1

我使用nuxtjs作为前端，将 Google recaptcha versi 3 放在我的网站中，但它总是在右下角给我 google captcha，我使用 recaptcha versi 3

这是我的屏幕截图 截屏

我将代码配置为文档但仍然无法正常工作，这是我的脚本调用 recaptcha google 放在 head 部分

function onloadCallback() {
  grecaptcha.ready(function() {
    grecaptcha.execute('6Le3oXkUAAAAACZn9Dbhriy9WFQQTEIqzlmm7bqc12', {action: 'action_name'})
    .then(function(token) {
      // Verify the token on the server.
    })
  })    
}

这是我的html

<div class="g-recaptcha" data-sitekey="6Le3oXkUAAAAACZn9Dbhriy9WFQQTEIqzlmm7bqc12" data-bind="recaptcha-submit" data-badge="inline"  :style="{ display: `block` }"></div>

我在谷歌上找到了这个，但仍然不适合我，我想念哪里

4

1 回答 1

0

当我看到您使用 Nuxt 时，我将在 Vue 中提供一个示例，您需要做的第一件事是在 HTML 代码的头部添加以下行：

    <script src='https://www.google.com/recaptcha/api.js?render=My recaptcha v3 site key'></script>

然后为该按钮添加一个点击功能：

  executreRecaptchav3: function () {    
        grecaptcha.execute('My recaptcha v3 site key', { action: 'action_name' })
            .then((token) => {
                //Store this token somewhere so you can send it to your server
                console.log(token);
            });

}

在这里，您拥有服务器中需要的令牌。至于为什么底部有一个recaptcha，因为recaptcha v3是不可见的，但这并不意味着它是recaptcha v2 invisible captcha，因为那是不同的。Recaptcha v3 返回分数，而不仅仅是告诉真/假。

于 2018-11-10T21:52:30.237 回答