HTMLisEasy.com
HTML tutorials for the rest of us...
  Lock HTTP Authentication: example & run-through  
<< HTTP Authentication Intro

While the GateKeeper is a nifty piece of JavaScript that rather effectively password protects pages, there is a more "by the book" method... HTTP authentication. This is entirely server based and under most circumstances, you can use it.

Here is an example of a .htaccess protected directory...

My Secret Stuff
(username is jimmy, password is page)
Note: When I wrote this little piece the tutorials were still on the old APK server. Since then I've put the tutorials on their own domain. Rather than re-write this whole thing to reflect that, I've just left it as is. So, that's where all the apk.net stuff comes from. I did re-create the above protected document at HTMLisEasy.com. So while the examples point to HTMLisEasy.com, the documentation refers to apk.net. Make sense? (See, you people get the fallout from my laziness ;-)

I'll document step by step what I did to create it. Then I'll point you to further resources so you can learn what else you can do with it.

Before we get started, let me warn you... this is the procedure on my server. Although the same procedure will do it for most others, it won't necessarily be the same for everyone. (I doubt that this procedure applies to many of the free web space providers out there. Or rather, you probably won't be able to do this at all on the free servers.)

First I made the directory (using my FTP client)...

http://junior.apk.net/~jbarta/tutor/keeper/mystash/

Then I placed into it secretstuff.html. I also placed an empty file named index.html because I didn't want someone to be able to get a listing of the contents (this is optional).

So, we have...

http://junior.apk.net/~jbarta/tutor/keeper/mystash/secretstuff.html

...and now we want to protect it.

You need a Telnet client. There is a Telnet client that comes with Windows, but it's junk (my opinion). I use a nice little freeware Telnet client called SimpTerm. You can grab my copy of the program from here.

Here we go. Fire up SimpTerm and let's get to work...

Type ALT+D...

SimpTerm screen capture

Enter your server name and click OK...

SimpTerm screen capture

If you can connect then that's a good sign. Some servers you won't even be able to connect with. If so, you're dead right out of the gate... at least going this route.

SimpTerm screen capture

Now enter your login and password.

You are now at your root directory...

SimpTerm screen capture

Type ls (that's ell s as opposed to one s or eye s) to display a listing of the contents of that directory.

SimpTerm screen capture

It only shows one directory... www.

To change into that directory, type cd www and hit return...

SimpTerm screen capture

Now type ls to list the contents of the directory...

SimpTerm screen capture

Notice that files have an extension (banner.gif, download.html) and directories do not (notetab, tutor).

NEXT >>
GateKeeper - Javascript Password Protection
GateKeeper 1  ·  GateKeeper 2  ·  GateKeeper 3  ·  HTTP Authentication  ·  The Vault
HTML 4.0 Reference      Barebones HTML Guide