Validating Recaptcha using Client-Side Web Service Calls

reCAPTCHA is a free CAPTCHA service that helps to digitize books, newspapers and old time radio shows.

Interactive Web applications may need to dynamically create the reCAPTCHA widget in response to user input. To support such applications, RECAPTCHA offers an AJAX API.

Heres a simple Demo on how to create and validate recaptcha using clientside web service call

<script type="text/javascript" src="http://api.recaptcha.net/js/recaptcha_ajax.js"></script>
<script src="Scripts/jquery-1.2.6.js" type="text/javascript"></script>

<script type="text/javascript">
        $(document).ready(function() {   showRecaptcha('recap') ;    });

        function GetWebService()
        {
            return DemoProject.Services.WebService1;
        }

        function showRecaptcha(element) {
            var RecaptchaOptions = {
                theme: 'custom',
                lang: 'en',
                custom_theme_widget: 'recaptcha_widget'
            };
            Recaptcha.create("xxxxxxxxxxxxxxxxxxxx", element, RecaptchaOptions);
            RecaptchaStr_en.play_again = "replay";
            RecaptchaStr_en.cant_hear_this = "can't hear";
        }

        function ValidateRecaptcha() {          
            GetWebService().ValidateRecaptcha(Recaptcha.get_challenge(),  Recaptcha.get_response(), onValidateRecaptchaSuccess, onValidateRecaptchaFailed);
        }

        function onValidateRecaptchaSuccess(ret) {
            if (ret == true)
            {
                alert('success');
            }
            else
            {
                alert('failed');

                //Reload recaptcha in case it fails
                Recaptcha.reload();
            }

        }

        function onValidateRecaptchaFailed(ret) {
           alert('an error has occured'); 
        }
</script>

//Add a scriptmanager to your page

<asp:ScriptManager ID="ScriptManager1" runat="server">
    <Services>
        <asp:ServiceReference Path="~/Services/WebService1.asmx" />
    </Services>
</asp:ScriptManager>

<div id="recap">
        <div id="recaptcha_widget" style='display: block'>
            <span>Please type in both words separated by a space. Words are not
                case-sensitive.</span>
            <div class="recaptcha_only_if_image">
                <span>Having trouble? <a href="javascript:Recaptcha.switch_type('audio')">
                    listen</a> to an audio captcha or <a href="javascript:Recaptcha.reload()">load</a>
                    a different image.</span>
            </div>
            <div class="recaptcha_only_if_audio">
                <a href="javascript:Recaptcha.switch_type('image')">Go back</a>to the image, or
                <a href="javascript:Recaptcha.reload()">load</a> a different audio captcha
            </div>
            <div id="recaptcha_image">
            </div>
            <div class="recaptcha_only_if_incorrect_sol">
                Incorrect please try again</div>
            <span class="recaptcha_only_if_image">Enter the words above:</span> <span class="recaptcha_only_if_audio">
                Enter the words you hear:</span>
            <input type="text" id="recaptcha_response_field" name="recaptcha_response_field"  />
        </div>
</div>
<input type="button" value="validate" onclick="ValidateRecaptcha();"  />

//WebService1.asmx

    [WebMethod(true)]
    [System.Web.Script.Services.ScriptMethod()]
        private bool ValidateRecapatcha(string challengeValue, string responseValue)
        {
            try
            {
                Recaptcha.RecaptchaValidator captchaValidtor = new Recaptcha.RecaptchaValidator
                {
                    PrivateKey = "xxxxxxxxxxxxxxxxxxxx",
                    RemoteIP = HttpContext.Current.Request.UserHostAddress,
                    Challenge = challengeValue,
                    Response = responseValue
                };
                Recaptcha.RecaptchaResponse recaptchaResponse = captchaValidtor.Validate();
                return recaptchaResponse.IsValid;
            }
            catch (Exception)
            {
        //log the error

                return false;
            }
        }

HTH

Regards

Bilal Shouman