AJAX Login System Demo

Creating a secure login system using XMLHttpRequest

This is an example of a login system that does not require page refreshes, but is still very secure. Valid usernames and passwords for this demo are user1/pass1 and user2/pass2. Try these, and also incorrect passwords to see the results.

Please note that this is not a functional form, your input will not go anywhere. It is solely for demonstrating an XMLHttpRequest login system in javascript.

Advantages

User does not need to refresh the page to login.
User is notified instantly on incorrect username/password combination.
Overall user experience is more seamless.
Password is not sent in plain text ever (more secure than traditional system).
Javascript convenience with server-side security (uses PHP/MySQL).
Uses one-time use random seed to hash the password before sending (making interceptions useless).

Disadvantages

System is more prone to brute force attacks.
- Can be minimized by adding a delay after a certain number of attempts per username or per client.
User may expect a login button.
- One could still be added without reloading the page.
Older versions of Safari cannot disable a password field.
This code uses the MD5 encryption algorithm, which has since been proven to be less secure than previously thought. If you use this code, I strongly recommend you switch to a more secure encryption algorithm, such as SHA-1. For sites were security is not crucial, MD5 should suffice.

Demonstration

Source

Questions

Can I copy your code?
Sure, although I'd recommend you rewrite it as you go so you can actually learn something useful. Also, passing someone else's code as your own is just uncool.

Why didn't you use [insert technology here]?
Basically I haven't done web development in close to a year, so I used what I knew best (PHP/MySQL) and used the Javascript that I remembered, along with a little bit of refreshing my memory. Perhaps I should have used object-oriented PHP or Javascript, but this works. If it is slightly confusing, I apoligise, this is only meant as a proof-of-concept.

Created: 28 Jan 2005.