使用 Google reCAPTCHA v3 进行语义 UI / Fomantic UI 表单验证

Question

我正在尝试找到一种使用 Google reCAPTCHA v3 验证语义 UI / Fomantic UI 表单的方法。我在 Stack 上找到了使用 Google reCAPTCHA v2 进行验证的选项。但是，新的 V3 验证形式不同，它使用了另一种形式的用户界面。

Answer 1

更新：我找到了方法。我将此来源用作初始参考：https://code.tutsplus.com/tutorials/example-of-how-to-add-google-recaptcha-v3-to-a-php-form--cms-33752。遵循使用语义 UI/Fomantic UI 的验证形式。另一方面，要验证服务器上的数据，请按照前面的参考资料了解更多信息。

表单验证：

var formSelector = 'formSelector'; // Form selector

$('.ui.form')
    .form({
        onSuccess(event, fields){
            var action = 'action'; // Action 
            var googleSiteKey = 'googleSiteKey'; // Google Site Key 
            
            grecaptcha.ready(function() {
                grecaptcha.execute(googleSiteKey, {action: action}).then(function(token) {
                    $(formSelector).append('<input type="hidden" name="token" value="'+token+'">');
                    $(formSelector).append('<input type="hidden" name="action" value="'+action+'">');
                    $(formSelector).unbind('submit').submit();
                });
            });
            
            return false;
        }
    });