Thursday, October 31, 2013

Creating a Random Captcha with refresh Option

We all know that creating captcha is not a tough job in ColdFusion. But, one newbie in ColdFsion just asked me to help in creating a random captcha for his application.

I thought to share with others.

I have divided the entire code into three parts.

  1. captcha.cfm - Page where we will display the captcha image.
  2. Util.cfc - It contains a user defined function "generateRandomText" to generate random captcha text.
  3. refreshCaptcha.cfm - Page which will handle AJAX call while refreshing captcha image.

Lets see the "captcha.cfm" below:
<!DOCTYPE HTML>
<html>
<head>
<script type="text/javascript" src="http://code.jquery.com/jquery-1.10.2.min.js"></script>
<script>
$(document).ready(function() {
$("#reloadC").click(function() {
$.get( "./refreshCaptcha.cfm", function( data ) {
var $img = $(data);
$( "#captcha" ).empty(); //Clear Old captcha image
$( "#captcha" ).append( $img ); //Add new image into the old position
});
});
});
</script>
</head>
<body>
<h1>CreateCaptcha</h1>
<div id="captcha">
<cfset request.utilObj = new Util() />
<cfset request.image = ImageCreateCaptcha(
57,
260,
request.utilObj.generateRandomText(8),
"low",
"calibri",
"30") />
<cfimage action="writetoBrowser" source="#request.image#" />
</div>
<input type="button" name="reloadC" id="reloadC" value="Refresh" />
</body>
</html>
view raw captcha.cfm hosted with ❤ by GitHub

Here, in above code I have used "ImageCreateCaptcha" function, which is added in ColdFusion 10 for captcha generation.

Lets see the "Util.cfc"
component {
public function generateRandomText( ntCaptchaLength ) {
//Characters we are using to generate captcha
var stChars = "0,1,2,3,4,5,6,7,8,9," &
"a,b,c,d,e,f,g,h,i,j,k,l,m,n,o,p,q,r,s,t,u,v,w,x,y,z," &
"A,B,C,D,E,F,G,H,I,J,K,L,M,N,O,P,Q,R,S,T,U,V,W,X,Y,Z";
var getRandIndex = 1;
var returnString = "";
for( var loopCntr = 1; loopCntr <= arguments.ntCaptchaLength; loopCntr ++ ) {
//Find a random index number between 1 and length of the charcter list
getRandIndex = randRange(1, listLen(stChars));
//Form string by combining the characters
returnString &= listGetAt(stChars, getRandIndex);
}
//Return the result
return returnString;
}
}
view raw Util.cfc hosted with ❤ by GitHub

In this file, I have written a function called "generateRandomText"  for generating captcha string. Logic is very simple, you can modify it according to your requirement.

Next, come to "refreshCaptcha.cfm":
<!--- Create Util Object --->
<cfset request.utilObj = new Util() />
<!--- Create random captcha image --->
<cfset request.image = ImageCreateCaptcha(
57,
260,
request.utilObj.generateRandomText(8),
"low",
"calibri",
"30") />
<cfimage action="writetoBrowser" source="#request.image#" />
view raw refreshCaptcha.cfm hosted with ❤ by GitHub

We are making AJAX call to this file which again generates random captcha image and sends to browser for display.

So, this is whole story for generating and refreshing captcha image in ColdFusion!!!

Posted by
Labels: , , , ,

3 comments:

  1. Anonymous24 November 2014 at 08:35

    That generateRandomText() function isn't really necessary. I just use createUUID() then reverse and grab the however many chars I need. I suppose I could just do a Right instead of a reverse and left. Anyway, the advantage of your algorithm is that you can control exactly which chars are in the random text. I like to exclude the numbers One and Zero and the letters L for Lima, I for Indigo and O for Oscar. The reason is the 1,L,I and O and 0 are too hard to tell apart, especially in a CAPTCHA. I mean, its not compulsory to use all 26 letters and all 10 digits, so why not reduce the confusion?

    My random text for CAPTCHAS generator is just this:

    ReplyDelete
  2. Blog2799928 February 2020 at 14:08

    Use this diet hack to drop 2 lb of fat in just 8 hours

    Well over 160000 women and men are hacking their diet with a simple and SECRET "liquids hack" to drop 1-2lbs each and every night while they sleep.

    It's simple and works with everybody.

    Here are the easy steps for this hack:

    1) Go grab a clear glass and fill it up half the way

    2) And now use this awesome HACK

    you'll become 1-2lbs thinner when you wake up!

    ReplyDelete
  3. Blogger28 February 2020 at 15:13

    This way my buddy Wesley Virgin's tale begins in this SHOCKING and controversial VIDEO.

    As a matter of fact, Wesley was in the army-and shortly after leaving-he discovered hidden, "self mind control" tactics that the CIA and others used to get whatever they want.

    As it turns out, these are the EXACT same methods tons of famous people (especially those who "come out of nowhere") and elite business people used to become wealthy and famous.

    You probably know how you use less than 10% of your brain.

    That's because most of your BRAINPOWER is UNCONSCIOUS.

    Maybe this thought has even taken place IN YOUR very own head... as it did in my good friend Wesley Virgin's head 7 years ago, while riding an unregistered, beat-up trash bucket of a car with a suspended license and on his banking card.

    "I'm very fed up with living check to check! Why can't I become successful?"

    You took part in those questions, right?

    Your own success story is waiting to happen. Go and take a leap of faith in YOURSELF.

    Watch Wesley Virgin's Video Now!

    ReplyDelete

Subscribe to: Post Comments (Atom)

Followers