Home arrow AJAX & Prototype arrow Page 3 - Protecting Web Forms with AJAX

Generating verification codes with Ajax - AJAX

Are you looking for a new way to protect your web forms from malicious hackers and spam bots? Then you've come to the right place. In this four-part article series, you'll learn how to use Ajax to protect those forms. Keep reading to learn how to build an Ajax-based verification code mechanism that you can use on your own web site.

  1. Protecting Web Forms with AJAX
  2. Developing a verification code mechanism
  3. Generating verification codes with Ajax
  4. Generating verification codes on the web server
By: Alejandro Gervasio
Rating: starstarstarstarstar / 8
March 18, 2009

print this article



In the section that you just read, I coded a simple HTML form for demonstrating how an Ajax-driven program can make it a bit safer against attacks and fake submissions. In this case, Iím going to develop a random code generator that will be coupled to the form, so each time a users tries to submit it, they will be asked to enter this checking code. So far, nothing unexpected, right?

However -- and hereís where things will get really interesting -- the verification code will be generated on the fly via an Ajax-based HTTP request. Therefore, to perform this task, Iím going to use the assistance of the Ajax module bundled with the jQuery library, in this way saving time and effort.

Basically, the Ajax application that will be charged with generating verification codes dynamically for the previous HTML form looks like this:

<script language="javascript" src="jquery.js"></script>

<script language="javascript">


// get verification code with Ajax

$.get('get_checkingcode.php',{data:'getting code'},function(checkingcode){$('#codebox').html(checkingcode);});



Even if youíre not familiar with the API of the jQuery library, itís pretty easy to understand how the above script works. In simple terms, it will request with Ajax a PHP file called ďget_checkingcode.php,Ē which will be responsible for generating a random verification code.

Then, this string will be sent back to the client, where it will be displayed within the HTML form before the form is submitted. You can see how this implements a simple mechanism that will protect the form against automated submissions. Of course, this isnít a bullet-proof approach, and certainly can be improved. But it can be quite useful for making web forms more secure, without having to deal directly with a server-side graphic library.

Now that you hopefully grasped how verification codes will be generated via Ajax-based HTTP requests, itís time to build the PHP file that actually sends this random string to the client.

The full details of how this PHP file will be created will be discussed in the course of the following section. Thus, click on the link below and read the next few lines.

>>> More AJAX & Prototype Articles          >>> More By Alejandro Gervasio

blog comments powered by Disqus
escort Bursa Bursa escort Antalya eskort


- Best AJAX Tutorials for Forms
- The Best AJAX Tutorials
- 8 Great Ajax Tutorials
- Using Ajax and jQuery
- Using Ajax and jQuery with HTML Forms
- Ajax.org Offers Cloud9 IDE for JavaScript
- Java Technologies Provider ICEsoft Releases ...
- Using Recaptcha in AJAX Prototype Framework ...
- Google's Closure Compiler Service API: Addit...
- Installing Google Web Toolkit: Introducing t...
- Google's Closure Compiler Service API: Displ...
- Google's Closure Compiler Service API: Deliv...
- Google's Closure Compiler Service API: the A...
- Google's Closure Compiler Service API: the S...
- Google's Closure Compiler Service API: Optim...

Developer Shed Affiliates


Dev Shed Tutorial Topics: