| Since its conception in 2005, AJAX (Asynchronous | | | | whole new webpage that shows an account |
| Javascript and XML) has changed the web world | | | | screen if the login was successful, or show an |
| as we know it today. It's helped websites evolve | | | | error screen if the login failed. This is the "old |
| into RIAs (rich internet applications) by allowing | | | | way" of logging users into their accounts. |
| webpages to make direct requests to a web | | | | A more savvy approach to this problem would be |
| server without reloading the page. This capability | | | | to check if the login and password is correct using |
| is vital in replicating the rich user experiences | | | | AJAX. Here's how it would work. Once the user |
| achieved in client applications. The purpose of this | | | | has typed in a login name and password, and |
| post is to help newcomers understand the | | | | pressed "Enter", you could have a Javascript |
| different ways that AJAX can be used to create | | | | function that invokes an AJAX call and sends two |
| RIAs. | | | | parameters, the login name and password. The |
| How AJAX Works | | | | web server takes those two inputs, and queries |
| An AJAX call is made from Javascript by calling a | | | | your user database to see if there is a match. If |
| URL with specific parameters. This URL typically | | | | there is, then the web server can return a |
| points to a servlet on a web server which takes | | | | success flag like "SUCCESS". If there is an error |
| the parameters that you've provided and queries | | | | like "This user does not exist" or "Password does |
| your database. If a response is required, the | | | | not match" then the web server could return one |
| serlvet puts together either a response message | | | | of these error messages. You would then have a |
| or an http friendly data structure like JSON, XML, | | | | Javascript function that accepts the AJAX |
| or CSV, and sends it back to the client. | | | | response. If the response is "SUCCESS", it uses |
| An example implementation | | | | window.location to send the user to their account |
| Let's say that you have a login form for your | | | | screen. If the response contains one of the error |
| web application. To ensure that the provided login | | | | messages, it can immediately show the error on |
| name and password is a match without using | | | | the screen without ever reloading the page. |
| AJAX, your web application would have to load a | | | | Good luck! |