Password Protecting a Page?

Note that if you are using a free web host that your web host probably does not permit you to password protect pages on your free site. Check the Terms of Service that you agreed to in getting your free site to ensure that password protection is permitted before attempting to apply any of the methods discussed here. Failure to check that password protection is permitted by your free web host prior to your applying such protection to pages on your site may result in the web host removing your site for a breach of their terms of service (depending on the host, no prior notice may be given). We accept no responsibility for any loses that you may suffer from applying the information on this and the associated pages to any web site that you may have hosted by a free web hosting service that does not permit password protection.

So you are looking for a way to password protect your page and someone has suggested to you that you can do it using Javascript. Well there are a number of disadvantages to using Javascript to password protect your page that you need to be aware of.

Given these disadvantages, I do not recommend that you use a Javascript to provide password protection for pages on your site. If you have telnet access to the server where your site is hosted then you can set up proper password protection that does not suffer from the above problems. Without telnet access, your options are more limited but if you obtain access to a password gate cgi script and use that in conjunction with frames so as to hide the page address you are probably protecting your page as far as possible given that you don't have the access to your server to be able to do any better.

You probably either have access to your server so that you can set up proper password protection or you have access to a password gate cgi that provides a better level of password protection than any javascript could so why would you want to consider a Javascript solution?

Only if you don't have access to either of these other options should you consider using Javascript.

If you do need to go with a Javascript solution then not just any password protection Javascript will do. As previously mentioned, most password Javascripts that you will find on the internet rely on having the password hard coded into the source code where anyone with a little knowledge can read it. So what we need is a Javascript where the password is not coded in the source at all or where the password is encrypted into the actual page that we want to protect. Let's consider these one at a time.

Password Not Coded

Having a Javascript test a password where the password to test against is not coded in the Javascript might sound impossible but it can be done by making the password part of the filename of the page that is to be password protected. An example of a Javascript that does this follows:

 function pass() {
var password = '';
password=prompt('Please enter your password:','');
if (password != null) {
location.href= password + ".html";
}
}

Of course you should make this an external Javascript to make it slightly more difficult to access the source. All that you need to do then to make a password protected link is to create the page to be password protected and save it in a file with the same name as the password (with .html added to the end) and to create a link to that page (or pages) that looks like this:

<a href="#" onclick="pass();return false;">Access a Password Protected Page</a>

Of course you may still want to use frames to help hide the relationship between the password and the page address.

When the link is selected a prompt box asking to have the password entered is displayed. If the prompt box is closed or cancel is selected then the prompt box will disappear and your visitor will remain on the current page. If a wrong password is entered then the default "page not found" page will be displayed.

 

Password Encrypted in Destination Page

If you use Web Page Protection to try to hide your page source from your visitors then it becomes possible to include a very simple password protection javascript into the page itself that is a lot more effective and which you might even prefer to using a gateway CGI script. This method has the advantage over the other methods in that the password protection no longer acts just as a gate but will ensure that anyone accessing the page needs to enter the password even if they know the exact filename that they want to access. Also, unlike the above script, this one allows you to specify a page to be displayed if a wrong password (or no password) is entered. Also this script can be applied to existing pages without having to recode any of the links to the page.

For this to work, you need to make sure that you encrypt the javascript before including it in the <head> section of the page so that people who know how to access the source of your page without viewing the page first can't easily discover the password. The password is then as secure as your page encryption, the encryption needs to be broken in order for the password to be determined. The rest of the page content also needs to be encrypted or it will be accessible by saving the page source even though the page itself is not viewable.

To create your own custom script simply make substitutions into the following code for your desired password and for a page to display when a wrong password is entered (the two spots not shown in bold text), encrypt the result (including the script tags) and include the resultant encrypted code immediately after the decryptor script.

<script type="text/javascript">var pw = prompt('Password',''); if (pw != 'password') top.location = 'index.html';</script>

Your page will now display a prompt box asking to have the password entered before the actual page content is displayed. If the prompt box is closed, cancel is selected, or a wrong password is entered then the alternate page will be loaded into the browser and the current page will not be displayed.

 

This article written by Stephen Chapman, Felgall Pty Ltd.

go to top

FaceBook Follow
Twitter Follow
Donate