Het beveiligen van een pagina of zelfs van een heel deel van je site is een iets waarvan veel mensen denken dat het vrij moeilijk zal zijn. Niets is minder waar: met een beetje kennis van JavaScript kom je een heel eind.
De beveiliging die hier wordt beschreven werkt als volgt: je vraagt de bezoeker om een wachtwoord. Vervolgens wordt de bezoeker doorverwezen naar een pagina die staat in een subdirectory die de naam van jouw wachtwoord heeft. Typt de bezoeker het goede wachtwoord in, dan zal hij de pagina te zien krijgen. Typt hij/zij een verkeerd wachtwoord in, dan wordt er verwezen naar een pagina in een niet-bestaande subdirectory: je bezoeker zal een melding krijgen dat de pagina niet bestaat.
Praktisch bekeken: stel, jouw site staat op http://www.provider.nl/~jouwnaam en je wilt een pagina beschermen. Noem deze pagina bijvoorbeeld index.html en plaats hem in een subdirectory met bijvoorbeeld de naam "stiekum". De URL van de pagina is dan http://www.provider.nl/~jouwnaam/stiekum/index.html.
Vraag je nu de bezoeker om een wachtwoord, dan verwijs je hem door naar de pagina http://www.provider.nl/~jouwnaam/wachtwoord/index.html. Wanneer hij dus als wachtwoord "stiekum" invoert zal hij de pagina te zien krijgen. Voert hij een ander wachtwoord in, dan bestaat de directory dus niet en krijgt hij een foutmelding.
Met deze methode zal je wachtwoord niet te vinden zijn in je broncode, omdat het wachtwoord onderdeel is van de URL waarnaar je verwijst!
De code:
<SCRIPT TYPE="text/javascript LANGUAGE="JavaScript">
<!--
function go() {
window.location.href = "http://www.provider.org/~jouwnaam/" +
document.formName.passwordName.value + '/index.html';
return false;
}
//-->
</SCRIPT>
<FORM NAME="formName" onSubmit="return go()">
Enter Password: <INPUT TYPE="password" NAME="passwordName" VALUE="" SIZE=8>
</FORM>
Kun je geen subdirectories maken dan kun je ook een enkele pagina beveiligen, door het bovenstaande script iets aan te passen. Het wachtwoord wordt dan de naam van je pagina, bijvoorbeeld stiekum.html.
<SCRIPT TYPE="text/javascript LANGUAGE="JavaScript">
<!--
function go() {
window.location.href = "http://www.provider.org/~jouwnaam/" +
document.formName.passwordName.value + '.html';
return false;
}
<FORM NAME="formName" onSubmit="return go()">
Enter Password: <INPUT TYPE="password" NAME="passwordName" VALUE="" SIZE=8>
</FORM>
//-->
</SCRIPT>
Wil je voorkomen dat je bezoeker een lelijke foutmelding krijgt wanneer het wachtwoord fout is, dan kun je dit eleganter oplossen. Kijk op Irt.org voor een uitgebreide beschrijving hiervan in het Engels.