Return to Home Page CREATING SECURE AREAS ON YOUR WEB SITE

B Y  S C O T T   D E L O A C H
Senior Member and Web Manager, Atlanta Chapter

Are you interested in providing online proceedings, meeting summaries, or other premium information on your web site but don't want non-members to access it? This article explains how to set up a password-protected area on your chapter web site. To make things easier, you can download this HTML page from the Atlanta Chapter web site at http://www.stc.org/region3/atl/www/passpage.htm.

This HTML page uses JavaScript to request a password from the user and compare it to a "hidden" password. It has been tested in IE 3+ and Netscape Navigator 2+. Although it can be cracked by a JavaScript programmer, it should provide a fair level of protection.

Wanna know a secret? To use the script, you will probably want to change the password. The password can be any case-sensitive string of seven characters. For simplicity, your password is also used as the filename of the protected page. For example, my password in this example is "Asecret." If a visitor enters "Asecret" for the password, then they will be taken to a file called Asecret.htm. Some suggested passwords are "MEMBERS," "meeting," "Proceed," and "STCpass." 

The password letters are hidden in the "encrypt" string as the following characters (counting from left to right):
A s e c r e t
8 10 4 12 24 31 18

To change "Asecret" to your password, simply replace the 8th, 10th, 4th, 12th, 24th, 31st, and 18th characters with your password. The letters are boldface in the code example to help you find them.
"Halt! Who goes there?" When visitors load the password page, they are asked to enter a password. If they enter the correct password, a dialog box will appear explaining that they will be taken to the protected page (in this case, "Asecret.htm") when they click the OK button. You can change the boldface "protected site" to the name of your protected area, such as "Online Proceedings" or "meeting minutes." If the visitor enters the wrong password, a dialog box will appear to let them know that the password is incorrect. When they click the OK button, the password page will be reloaded. 
"This page will self destruct in 5 seconds!" If you change the name of this HTML page, you will need to change the boldface "passpage.htm" to the new filename. If your protected page has an "html" extension rather than "htm," you will need to change the boldface "htm" to "html." If you run into other problems, feel free to send me an e-mail. 
<html>
<head>
<title>STC Password Page</title>
<html>
</head>

<script>

function makepass () {
encrypt="SDceiHnAisecyuKgytkbMvdrgjNBhreytSb xcvnbvbNGHjGKUYyukryLtUILuioYOIERqEgfeWbCXVB vEJHtyYUFSTBILKUILghmnfcuregvxcvnbsftgvAM"

a = 741 % 147 + 1
b = 654 % 456 / 22
c = 987 % 123
d = 753 % 357 - 44 + 4 * 4
e = 852 % 258 - 55
f = 654 % 321 + 3 * 6
g = (777 % 147 + 77) / 7

pass=encrypt.charAt(a) + encrypt.charAt(b) + encrypt.charAt(c) + encrypt.charAt(d) + encrypt.charAt(e) + encrypt.charAt(f) + encrypt.charAt(g)
}

function chkpass() {
userpass=document.passform.password.value;
if (userpass == pass) {
alert("Click OK to view the protected site.");
location.href = pass + ".htm";
}
else {
alert("Sorry, your password is incorrect.");
location.href = "passpage.htm";
}
}
</script>

<body onload="makepass();">
<form name="passform">
Please enter your password:
<input type="password" name="password" value="" size="10"><br>
<input type="button" name="btn" value=" Submit " onclick="chkpass();return false;">
</form>

</body>
</html>

Return to Home Page Scott DeLoach is manager of the Society's Online Information SIG. If you have any questions, you can reach Scott at scott@userfirst.net.
Winter 1999
Volume 2, # 1