faqts : Computers : Programming : Languages : JavaScript

+ Search
Add Entry AlertManage Folder Edit Entry Add page to http://del.icio.us/
Did You Find This Entry Useful?

10 of 14 people (71%) answered Yes
Recently 8 of 10 people (80%) answered Yes

Entry

How do I protect and verify passwords without using server-side scripts

Apr 6th, 2008 19:12
ha mo, Mark Szlazak, Jean-Bernard Valentaten, "Instant JavaScript" by Webb, et al. pp208-218


Hmm, that's a tough question. Basically you cannot, since a viewer could
just snoop through your js-code and reverse-engineer your
coding-algorithm.
If you really need to do this (I really do not recommend this), you can
at least make it harder to access the algorithm (though not make it
impossible), by placing the code in a seperate js-file and including it
with the <script src="this/is/where/your/script/is.js"...> tag.
The common internet user won't bother finding and/or downloading the
file. Someone that really want's to get in will!!
Spet two in making it harder is to encode the js-functions themselves
using a second algorithm and have it decoded by a second js-file (also
included the same way the first is). Now this is a little hard to
perform, but practicable (I've seen it done once or twice).
The third step is to use a password-coding algorith that is hard to
reverse-engineer (e.g. that takes a lot of steps to encode etc.).
This might keep someone that really badly wants to enter your site
(protected area) and is not familiar with these techniques from doing so
for about half an hour.
That's not really much if you think about it.
Another very easy and much more secure way is to dedicate a protected
area in the web-server itself. You don't need any scripts for that,
since all the new server-softwares are capable of doing so.
HTH,
Jean
-------
Just after posting this question, I found a solution that doesn't 
require encoding on the client side. It uses a similar technique to the 
one found at the post:
       "Can I check with client side JavaScript whether a http server 
is up?"
       http://www.faqts.com/knowledge_base/view.phtml/aid/1799/fid/124
Basically, "ping" the server to see if an image file with the same 
name as the password exists inside a folder with the same name as the 
username. 
       username/password.gif
The image files associated with each password are just "1 pixel" gif 
files and they are used along with two event handlers:
       onload
and
       onerror
If the file exists, the onload handler fires for a valid login, and for 
instance, can then server up a html page (in the same location as 
the "password" image file) that can also have the same name as the 
password: 
       location.href = username + '/' + password + '.html';
The onerror handler fires for invalid logins. Unlike checking 
for "password named" html files, this image file technique won't cause 
the browser to display a 404 error not-found message when the html file 
doesn't exist.   
<HTML>
<HEAD><TITLE>Website Login</TITLE>
<SCRIPT>
function checkLogin(form) {
	loginData = [];
	for (var e = 0; e < 2; e++) {
		var el = form.elements[e];
		if (el.value =="" || el.value == null) {
			alert("Please fill out the field " + el.name);
			el.focus();
			return false;
		}
		el.value = el.value.replace(/^\s+/, "").replace(/
\s+$/, "");
		loginData[e] = el.value.toLowerCase();
	}
	var img = new Image();
	img.onerror = function (evt) {
		alert('Invalid "user name" and/or "password" - please 
reenter');
		document.login.username.value = '';
		document.login.password.value = '';
	}
	img.onload = function (evt) {
            alert('Valid login');
      //    fileURL = loginData[0] + '/' + loginData[1] + '.html'
      //    location.href = fileURL;
	}
	img.src = loginData[0] + '/' + loginData[1] + '.gif';
	img = null;
}
</SCRIPT>
</HEAD>
<BODY TOPMARGIN="10" LEFTMARGIN="10" MARGINHEIGHT="10" MARGINWIDTH="10" 
SCROLL="no" BGCOLOR="#FFB573">
<TABLE BORDER="0" WIDTH="100%" CELLPADDING="0" CELLSPACING="0">
	<TR HEIGHT="30" VALIGN="middle">
		<TD NOWRAP WIDTH="100%" HEIGHT="30" ALIGN="center" 
BGCOLOR="#04029C"><B><FONT FACE="Verdana,Arial" SIZE="3" 
COLOR="white">Only registered users can continue</FONT></B></TD>
	</TR>
</TABLE>
<FORM NAME="login" ONSUBMIT="return checkLogin(this)">
<TABLE BORDER="0" CELLPADDING="0" CELLSPACING="0" ALIGN="center">
	<TR HEIGHT="10"><TD COLSPAN="2" HEIGHT="10"></TD></TR>
	<TR>
		<TD ALIGN="right"><FONT FACE="Verdana,Arial" 
SIZE=2>username: </FONT></TD>
		<TD ALIGN="left"><INPUT TYPE="text" 
NAME="username"></TD>
	</TR>
	<TR HEIGHT="10"><TD COLSPAN="2" HEIGHT="10"></TD></TR>
	<TR>
		<TD ALIGN="right"><FONT FACE="Verdana,Arial" 
SIZE=2>password: </FONT></TD>
		<TD ALIGN="left"><INPUT TYPE="password" 
NAME="password"></TD>
	</TR>
	<TR HEIGHT="20"><TD HEIGHT="20"></TD><TD HEIGHT="20"></TD></TR>
	<TR>
		<TD COLSPAN="2" ALIGN="left"><INPUT TYPE="checkbox" 
NAME="savepassword" VALUE="true"><FONT FACE="Verdana,Arial" 
SIZE=2> Save password</FONT></TD>
	</TR>
	<TR HEIGHT="20"><TD HEIGHT="20"></TD><TD HEIGHT="20"></TD></TR>
	<TR>
		<TD COLSPAN="2" ALIGN="left">
			<INPUT TYPE="button" VALUE="Login"  
ONCLICK="checkLogin(this.form)">
			<INPUT TYPE="reset" VALUE="Reset">
			<INPUT TYPE="Button" VALUE="Cancel" 
ONCLICK="javascript:window.close();">
		</TD>
	</TR>
</TABLE>
</FORM>
</BODY>
</HTML>
Happy programming,
Mark
http://www.businessian.com
http://www.computerstan.com
http://www.financestan.com
http://www.healthstan.com
http://www.internetstan.com
http://www.moneyenews.com
http://www.technologystan.com
http://www.zobab.com
http://www.healthinhealth.com