“RECAPTCHA” on Visualforce Page & Force.com Site

What is reCAPTCHA?

A CAPTCHA is a challenge-response test used in applications to determine whether a human or a computer is interacting with the application. reCAPTCHA is a free service that protects your site from spam and abuse. It uses a dvanced risk analysis techniques to tell humans and bots apart. With the new API, a significant number of your valid human users will pass the reCAPTCHA challenge without having to solve a CAPTCHA.

Lets go and see how to use reChaptcha on visual force page. 

Few steps are given below, Please follow.

Step 1 :  Free sign up for reCaptcha key.

Go to -> https://www.google.com/recaptcha/admin#list

Label: The URL of VF Page where the reCaptcha will be embedded (You can replace this with the Public Site Page URL if embedding reCaptcha in Public Site).
Domains: As we are embedding the reCaptcha in Salesforce.com, keep the domains as force.com and Salesforce.com.

  After clicking on “Register” button. You will get Site Key & Secret Key.

 Step 2 : Go to –> Setup –> Remote Site Settings –> New Remote Site.

Enter Remote Site Setting Name what ever you want and Remote site URL, in this case you will need to enter www.google.com in Remote Site URL textbox.

Step 3 :  Create a new visualforce page.

<apex:page showheader=”false”  controller=”reCAPTCHA2_Controller” >
<link href=”//netdna.bootstrapcdn.com/bootstrap/3.1.1/css/bootstrap.min.css” rel=”stylesheet” media=”screen”/>
<div class=”jumborton”>
<apex:pageBlock >
<apex:pageMessages />
<apex:form >
<apex:pageBlockSection columns=”1″ collapsible=”true” title=”Create Contact useing reCaptcha”>
<apex:pageBlockSectionItem >
<apex:outputLabel for=”inputName” value=”First Name”/>
<apex:inputText value=”{!myfName}” id=”inputName”/>
</apex:pageBlockSectionItem>
<apex:pageBlockSectionItem >
<apex:outputLabel for=”inputName” value=” Last Name”/>
<apex:inputText value=”{!mylName}” id=”inputName”/>
</apex:pageBlockSectionItem>
<apex:pageBlockSectionItem >
<apex:outputLabel for=”inputEmail” value=”Email”/>
<apex:inputText value=”{!myEmail}” id=”inputEmail”/>
</apex:pageBlockSectionItem>
<div class=”g-recaptcha” data-sitekey=”{!sitekey}”></div>
<script src=’https://www.google.com/recaptcha/api.js’></script>
<br/>
<apex:commandButton value=”Create Contact” action=”{!doVerify}”/>
</apex:pageBlockSection>
</apex:form>
</apex:pageBlock>
</div>
</apex:page>

Step 4 : Create an Apex class.

public with sharing class reCAPTCHA2_Controller {

public String myfName { get; set; }
public String mylName { get; set; }
public String myEmail { get; set; }
private static String baseUrl = ‘https://www.google.com/recaptcha/api/siteverify’;
private static String secret = ‘6LcvxxxxxAAAAG2pEZPuC76xxxxx-xxxxxxxxxxx’;//      Here, use your secret key.

public String sitekey {
get { return ‘6LcvXxxxxxxAAIHwXLUbguxxxxxxQbxxxxxxxxxx’; }

        //Here, use your site key.
}public String response  {
get { return ApexPages.currentPage().getParameters().get(‘g-recaptcha-response’); }
}public PageReference doVerify ()
{
String responseBody = makeRequest(baseUrl,’secret=’ + secret +’&response=’+ response);
String success = getValueFromJson(responseBody, ‘success’);
if(success.equalsIgnoreCase(‘true’))
{
Contact con = new COntact( LastName = mylName, FirstName= myfname, email=myemail);
try{
insert con;
pagereference p = new pagereference(‘/’+con.id);
return p;
}
Catch(exception e)
{
ApexPages.Message errorMsg = new ApexPages.Message(ApexPages.Severity.ERROR, ‘Unexpected error while creating contact’);
ApexPages.addMessage(errorMsg);
return null;
}
}else{
ApexPages.Message errorMsg = new ApexPages.Message(ApexPages.Severity.ERROR, ‘Please verify the captcha’);
ApexPages.addMessage(errorMsg);
return null;
}}

private static String makeRequest(string url, string body)
{
HttpResponse response = null;
HttpRequest req = new HttpRequest();
req.setEndpoint(url);
req.setMethod(‘POST’);
req.setBody (body);
try{
Http http = new Http();
response = http.send(req);
return response.getBody();
}catch(System.Exception e)
{
System.debug(‘ERROR: ‘ + e);
}
return ‘{“success”:false}’;
}

public static string getValueFromJson ( String strJson, String field )
{
JSONParser parser = JSON.createParser(strJson);
while (parser.nextToken() != null) {
if ((parser.getCurrentToken() == JSONToken.FIELD_NAME)) {
if(parser.getText() == field){
// Get the value.
parser.nextToken();
return parser.getText();
}
}
}
return null;
}
}

NOW WE ARE READY TO USE :))

Please follow and like us:

Leave a Reply

Your email address will not be published. Required fields are marked *

WordPress spam blocked by CleanTalk.