reCaptcha / Captcha Integration with Adobe CQ5/AEM6.0

Before going to start you should register with reCAPTCHA to get a public and private key to use in the code.

Loading widget

create a CQ component Ex : captchintegration

Add below code to your component JSP

<%@include file="/libs/foundation/global.jsp"%>

<%@ page import="net.tanesha.recaptcha.ReCaptcha" %>

<%@ page import="net.tanesha.recaptcha.*" %>

<%

  //Getting remote ip addres to validate catpcha 

  String ipAddress = request.getHeader("X-FORWARDED-FOR");  

  if (ipAddress == null) {  

ipAddress = request.getRemoteAddr();  

   } 

 %>

    <input type="hidden" value="<%=ipAddress%>" id="remoteIPAdderess" >

    <input type="hidden" value="<%=currentNode.getPath()%>" id="curNodePath" >

    <% ReCaptcha reCaptcha = ReCaptchaFactory.newReCaptcha("<Public Key>", "<Private Key>", false); %>

    

    <h1 id="page-title" class="title">Google Captch Integration in CQ</h1>

    <form accept-charset="UTF-8" id="testCaptcha" method="post" action="" class="contact-press-form ajax-form">

        <div id="gooleCaptcha">

            <input type="hidden" value="form-U5ArplaaF5MKYCMnyZkQDZfvXEy7bO7JLc5e6VCKses"  name="form_build_id"> 

            <input type="hidden" value="apollocontactpress_contact_form" name="form_id">

    

            <fieldset class="captcha form-wrapper">

                <legend>

                    <span class="fieldset-legend">CAPTCHA</span>

                </legend>

                <div class="fieldset-wrapper form-item form-item-captcha">

                    <%=reCaptcha.createRecaptchaHtml(null, "clean", null) %>

                    <div class="error-message"></div>

                </div>

            </fieldset>

            <input type="button" id="test" class='testCaptcha' value="test">

        </div>

    </form>

<script>

$(function() { 

  

  $('#gooleCaptcha').on('click','.testCaptcha',function(){

      alert("redy captch integration");

      var cpatchaFlag = false;

        var remoteIP=$('#remoteIPAdderess').val();

        var currentNodePath = $("#curNodePath").val();        

        var captchaField = $('#recaptcha_response_field');

        var capResponse=$('#recaptcha_response_field').val();

        var capChallange=$('#recaptcha_challenge_field').val();                 

        var captchValUrl=currentNodePath+'.validatecaptcha.html';

        if($.trim(capResponse).length === 0){

alert("response is empty");

}else{  

            var isValidCaptcha="";

            $.ajax({                          

                url: captchValUrl,

                async: false,

                data: {'remoteAddr':remoteIP,'recaptcha_response_field' : capResponse,'recaptcha_challenge_field':capChallange},

                success: function (response, status, xml) {

                    isValidCaptcha=response;

                }

            });

            

            if($.trim(isValidCaptcha) === 'true'){ 

                alert("valid captcha");

                $('#recaptcha_response_field').css({border : '1px solid black !important'});

            }else{

                alert("invalid captcha");

                $('#recaptcha_response_field').css({border : '1px solid red !important'});

            }

            

        }

  });  

});

    </script>

Validate Captcha 

To validate Captcha create validatecaptcha.jsp under you component. 

Add below code to newly created JSP

<%@include file="/libs/foundation/global.jsp"%>

<%@ page import="net.tanesha.recaptcha.ReCaptcha" %>

<%@ page import="net.tanesha.recaptcha.*" %>

<%

ReCaptchaImpl reCaptcha = new ReCaptchaImpl();

reCaptcha.setPrivateKey("<Private Key>");

String remoteAddr =  request.getParameter("remoteAddr");

String challenge = request.getParameter("recaptcha_challenge_field");

String uresponse = request.getParameter("recaptcha_response_field");

ReCaptchaResponse reCaptchaResponse = reCaptcha.checkAnswer(remoteAddr, challenge, uresponse);

if (reCaptchaResponse.isValid()) {

  out.print("true");

  log.info("valid capticha");

} else {

  out.print("false");

  log.info("invalid capticha");

}

%>

Maven dependency 

I have use the below maven dependency and exported in CORE bundle

     <dependency>

  <groupId>net.tanesha.recaptcha4j</groupId>

  <artifactId>recaptcha4j</artifactId>

  <version>0.0.7</version>

    </dependency>

Note : Replace your public key and private key