javascript - 如何将 reCAPTCHA 添加到表单

Question

我正在尝试将 reCaptcha 添加到我的表单中，但它并没有比验证更进一步。请帮忙!

我已经添加了 key ，并且已经添加了/php/recaptachalib.php 的路径

但由于某种原因它不起作用，当我输入验证码或错误输入验证码时，当我单击“提交”时，什么也没有发生。

验证码

    <form id="another_form" name="another_form" method="post">
        <input type="submit" value="Submit Another Form" />
    </form>

    <div id="recaptchaModal" title="reCAPTCHA" style="display:none;">
        <p>Please fill out this reCAPTCHA to submit this form.</p>
        <div id="recaptcha_block"></div>
    </div>

    <script>
        $('form').on('submit', function(e){
            e.preventDefault();
            var formID = e.currentTarget.id;

            $("#recaptchaModal").dialog({
                modal: true,
                resizable: false,
                width: 400,
                open: function(e, ui){
                    Recaptcha.create("your_recaptcha_public_key",
                        "recaptcha_block",
                        {
                            theme: "red",
                            callback: Recaptcha.focus_resonse_field
                        }
                    );
                },
                close: function(e, ui){
                    Recaptcha.destroy();
                },
                buttons: {
                    "Validate reCAPTCHA": function(){
                        $.ajax({
                            url: "/url/to/verify/recaptcha",
                            type: 'post',
                            data: {
                                challenge: Recaptcha.get_challenge(),
                                response: Recaptcha.get_response(),
                                additional_data: here
                            },
                            success: function(data){
                                if(data != "success"){
                                    alert("The reCAPTCHA wasn't entered correctly. Please try again.");
                                    Recaptcha.reload();
                                }
                                else{
                                    //-- submit your form with AJAX + MVC-style
                                    $.ajax({
                                        url: "/your/submission/url/"+formID,
                                        type: "post",
                                        data: $('#'+formID).serialize(),                                
                                        success: function(data){
                                            //-- forward user to your thank you page
                                            window.location.href = '/url/to/your/thank/you/page/'+formID;
                                        }
                                    });
                                }
                            }
                        });
                    },
                    Cancel: function(){
                        $(this).dialog("close");
                    }
                }
            });
        });
    </script>
</body>

Answer 1

验证码是一个脚本，可以防止机器人向表单发送垃圾邮件，即它验证代理是否是真正的人类。其次，它通过识别图像中的对象来作为 Google 机器学习的训练
步骤1)转到https://www.google.com/recaptcha/admin#list .

第 2 步)选择您要添加的验证码类型。

步骤 3) 选择其用途的域。例如，indiaedge.in

第 4 步)点击“注册”。

第 5 步)现在您将看到您的站点 key 和 secret key 。

第 6 步)将脚本标记粘贴到页面的标题部分。
How to add Captcha in Login Form