JavaScript is very handy at making forms, allowing for much more customization and easier ways to send data. So making Login forms using JavaScript may seem to many to be a very feasable idea. However, JavaScript is very bad at protecting Passwords, as since the passwords are not encypted and the whole JavaScript code is in the page, a person could just view the Page Source and find out everything. Even if you use an external JavaScript, it would still be poor as the file name for the external JavaScript would still be revealed.

But I have an answer! There is a relatively easy way to make a moderately-secure password system using JavaScript. And here's the trick: you don't use a password at all!

First, make a webpage with the following content:

This page will work as the Login Page.

Now, rename the file you wish to protect so that the bit BEFORE the extension is the same as the password you want to use. To prevent people seeing this file, you should disable indexing for the folder it is in.

Now edit the login page again, and in the HEAD tag of the page, add this:


If the file you are protecting uses an extension other than .html, change the ".html" bit to match the extension.

This script directs people to the protected file if the password matches, because it uses the entered password as a redirect to the file. So if the password does not match, the users will either be directed to a non-existant file (Error 404), or a completely different file from the one they wanted to get! This method is only "moderately secure", though, because the actual file is not protected and can still be accessed if someone knows the file's name. So you shouldn't use it for high-security files, but if you just want to keep out the general public, this is a good, simple solution.

Oh, and just a disclaimer. Some HTML Help websites appear to be distributing scripts similar to my one. While they follow the same principle as my own, they are in no way a basis for my code. This whole tutorial is completely, 100%, my own writing, and any similarities are purely coincidential.

This post has been edited by gameratheart: May 15 2008, 11:15 PM

I would have to disagree that javascript is great at making forms, yeah they can produce some nice little features, but once you get into PHP coding a form in javascript seems 10 years ago. I was thinking though why wouldn't you just code so you can password protect the fold through the hosting admin panel. I know trap17 cpanel has a folder protection process and so if you code the script to follow that password then it saves you the time of trying to hardcode the group of files within that folder. Of course, I think with a bit of tweaking with javascript and php password protection scripting you might be able to add a second layer of protection

Hey! I remember this method! It's pretty ingenious, but rather vulnerable to man-in-the-middle attacks. And packet sniffing will find that plaintext out in a second. I'd rate it pretty good - assuming you have no malignant character with knowledge of network security. What's the chances of tha- oh wait...

Php does help, but again, man-in-the-middle attacks. I'm pretty sure trap uses ssl. (you know, the https:// stuff). Which itself uses SHA-1 at least if I remember right. Personally, I'd go with SHA-512 cause a break in 2^39 attempts isn't that fun, but we can't be picky with programs developed for us...

(edit: ssl, not ssh. duh...)

This post has been edited by osknockout: May 16 2008, 04:16 PM

Yes, obviously if you do have any knowledge of PhP or you are using a Hosting Platform with SSL Password Protection (which Trap17 does), you should use these to secure your files instead of the method I mentioned above, as they are much more secure. This tutorial is really meant as a simple alternative for people who are not expirienced with PhP and do not have any other method of Password Protection for their site's content.

And Saint, while you may be right that Javascript's abilities pale in comparision to PhP, that doesn't mean Javascript is an old-skool coding platform. Actually, if you know how to use Javascript cleverly enough, you can use it with PhP to make some awesome scripts. Just look at some of the popular forum software on the web today...

OK first of all javascript shouldn't be used for such purposes like forms and security in general because javascript is not secured at all. And this is the main reason why would I discard it as language of choice for such things. So what is the point. It is very simple javascript is being executed on your clients browser and because of that there have beeen developed many different mathods for obtaining or changing javascript on the page.

Javascript should be used only for sending informations back and forth that is I mean on AjAX(asynchronus javascript and XML) and you should use it to make some nice things to your web page like changing on the page in the real time that is without reloading every single part of the page. Like hover overs and mouse clicks when there is no need to send informations to the server and back. You can even use it to send informations back and forth to the server. But don't use it for any security jobs and for gods sake any inputs. But nontheless when you are programming some portal you should be able to check all the data inserted trough the page.

Also consider that php is server executed language and you have more control over it that is the main reason why it should be used against javascript not that one or the other are old fashioned or something like that. But the thing is that you have to have control over what your users are inputting and check all the data this is the main reason. And in the end I would like to mention that both languages have its good and bad things.