I would like to integrate my username and password protected javascript into my website. I am
currently useing microsoft frontpage to build my website.
Any help would be appreciated!
I really wouldn't recommend using Javascript protection since it's VERY unsafe, unless the content you're tying to protect isn't that important. However, if you want to, would you mind posting your code do far?
Unless it stores the name/pass as an MD5 hash or similar, I bet it would be crackable in less than five minutes. And depending on how the script actually stores the protected data, it might be even easier to bypass it.
Anyway, like Nico noted, the actual code would be useful...
To be honest with you guys I have no idea what i'm doing. Someone gave me this script and I really don't know if its a good one or not. Here is the login HTML and JavaScript to put on my webpage to password-protect my site:
Code:
<center><form name=login>
<table border=1 cellpadding=3>
<tr><td colspan=2 align=center><font size="+2"><b>Members-Only Area!</b></font></td></tr>
<tr><td>Username:</td><td><select name=memlist>
<option value='x'>
</select></td></tr>
<tr><td>Password:</td><td><input type=password size=10 maxlength=8 name=pass></td></tr>
<tr><td colspan=2 align=center><input type=button value="Login" onclick="check(this.form)"></td>
</tr>
</table>
</form>
<SCRIPT LANGUAGE="JavaScript">
<!-- Begin
var params=new Array(4);
var alpha="ABCDEFGHIJKLMNOPQRSTUVWXYZABCDEFGHI";
function check(form) {
which=form.memlist.selectedIndex;
choice = form.memlist.options[which].value+"|";
if (choice=="x|") {
alert("Please Select Your Name From The List");
return;
}
p=0;
for (i=0;i<3;i++) {
a=choice.indexOf("|",p);
params[i]=choice.substring(a,p);
p=a+1;
}
h1=makehash(form.pass.value,3);
h2=makehash(form.pass.value,10)+" ";
if (h1!=params[1]) {
alert("Incorrect Password!"); return; };
var page="";
for (var i=0;i<8;i++) {
letter=params[2].substring(i,i+1)
ul=letter.toUpperCase();
a=alpha.indexOf(ul,0);
a-=(h2.substring(i,i+1)*1);
if (a<0) a+=26;
page+=alpha.substring(a,a+1); };
top.location=page.toLowerCase()+".html";
}
function makehash(pw,mult) {
pass=pw.toUpperCase();
hash=0;
for (i=0;i<8;i++) {
letter=pass.substring(i,i+1);
c=alpha.indexOf(letter,0)+1;
hash=hash*mult+c;
}
return(hash);
}
// End -->
</script>
</center>
Last edited by TwoD; 06-27-06 at 02:26 PM.
Reason: Please use [code][/code] wrappers! And pay attention to the sticky threads...
I assume there's another part to this protection method, one which "creates" the user accounts by encoding the protected page name and so on.
It does use some kind of hashing method, but it beats me how it works. I won't bother trying to figure it out because of the "ugly" code. The person who wrote it should study a reference document closer, using substring(i,i+1) to get a single character is much easier done with charAt(i) for example....
Putting that on your page should be pretty straight forward. Simply paste it wherever on the page you want the loginbox to appear. Then you need to fill in the username list. How to do that properly is probably described in some document that came with the script, I can't tell you how since I don't know how the encryption method works.
I wouldn't rely on this to protect my pages. Once a visitor has been to the protected page, he can always go back by manually typing in the URL which the script relays him to after loggin in. Then he wouldn't need to login at all, since all the script does is to decode the page name, using the password as a kind of keyword or seed.
A serverside solution is always better. It will let you keep track of the user throughout the session, force the user to log in each visit (either manually or with a cookie) and so on. It will also keep the server in control of all code related to the login procedure, keeping it without reach from all visitors and not hinder anyone who has turned off JavaScript.
Thanks for the bit of information it was very helpful. But I pose another question. What do you mean by a serverside solution and how do I accomplish this? - Like I said before I am very new at this and any advice or suggestions what help me out a great deal. Thanks!
By the way here is the complete script.
This is the first part-
Code:
<center><form name=login>
<table border=1 cellpadding=3>
<tr><td colspan=2 align=center><font size="+2"><b>Members-Only Area!</b></font></td></tr>
<tr><td>Username:</td><td><select name=memlist>
<option value='x'>
<option value='John Smith|42691|NGLOQEMM'>John Smith
<option value='Peter Jones|52219|GNLVAPMV'>Peter Jones
<option value='Sue Brown|18215|PXAPGWKY'>Sue Brown
<option value='Sally West|64403|NUIRTURT'>Sally West
</select></td></tr>
<tr><td>Password:</td><td><input type=password size=10 maxlength=8 name=pass></td></tr>
<tr><td colspan=2 align=center><input type=button value="Login" onclick="check(this.form)"></td>
</tr>
</table>
</form>
<SCRIPT LANGUAGE="JavaScript">
<!-- Begin
var params=new Array(4);
var alpha="ABCDEFGHIJKLMNOPQRSTUVWXYZABCDEFGHI";
function check(form) {
which=form.memlist.selectedIndex;
choice = form.memlist.options[which].value+"|";
if (choice=="x|") {
alert("Please Select Your Name From The List");
return;
}
p=0;
for (i=0;i<3;i++) {
a=choice.indexOf("|",p);
params[i]=choice.substring(a,p);
p=a+1;
}
h1=makehash(form.pass.value,3);
h2=makehash(form.pass.value,10)+" ";
if (h1!=params[1]) {
alert("Incorrect Password!"); return; };
var page="";
for (var i=0;i<8;i++) {
letter=params[2].substring(i,i+1)
ul=letter.toUpperCase();
a=alpha.indexOf(ul,0);
a-=(h2.substring(i,i+1)*1);
if (a<0) a+=26;
page+=alpha.substring(a,a+1); };
top.location=page.toLowerCase()+".html";
}
function makehash(pw,mult) {
pass=pw.toUpperCase();
hash=0;
for (i=0;i<8;i++) {
letter=pass.substring(i,i+1);
c=alpha.indexOf(letter,0)+1;
hash=hash*mult+c;
}
return(hash);
}
// End -->
</script>
</center>
2nd part
<center><table border=1>
<tr><form name=members><td rowspan=4>
<select name=memlist size=10 onChange="showmem(this.form)">
<!-- "member name | password | destination pagename |" -->
<option selected value="John Smith|password|mainpage|">John Smith
<option value="Peter Jones|theirpwd|endpages|">Peter Jones
<option value="Sue Brown|asdfvcxz|nowheres|">Sue Brown
<option value="Sally West|zaqxswde|logintop|">Sally West
</select></td>
<td align=right>User:</td><td><input type=hidden value="0" name=entry>
<input type=text name=memname size=8 value=""></td></tr>
<tr><td align=right>Password:</td><td><input type=text name=password size=8 maxlength=8><font size="-1"><-- Must be exactly 8 characters</font></td></tr>
<tr><td align=right>Page Name:</td><td><input type=text name=pagename size=8 maxlength=8><b>.html</b><font size="-1"><-- Must be exactly 8 characters</font></td></tr>
<tr><td colspan=2 align=center>
<input type=button value="New User" onclick="addnew(this.form);">
<input type=button value="Delete User" onclick="delthis(this.form);">
<input type=button value="Update/Show Coding" onclick="update(this.form); create(this.form);"></td></tr>
<tr><td colspan=3 align=center>
<input type=text size=60 name=message value="Note: Password/Page Name must be exactly 8 letters! (a-z)">
<input type=hidden name=num value=1></td>
</form></tr>
</table>
<hr size=2 width=75%>
<form name=js><textarea cols=75 rows=10 name=scrpt wrap=virtual>
<SCRIPT LANGUAGE="JavaScript">
<!-- Begin
var params=new Array(4);
var alpha="ABCDEFGHIJKLMNOPQRSTUVWXYZABCDEFGHI";
function check(form) {
which=form.memlist.selectedIndex;
choice = form.memlist.options[which].value+"|";
if (choice=="x|") {
alert("Please Select Your Name From The List");
return;
}
p=0;
for (i=0;i<3;i++) {
a=choice.indexOf("|",p);
params[i]=choice.substring(a,p);
p=a+1;
}
h1=makehash(form.pass.value,3);
h2=makehash(form.pass.value,10)+" ";
if (h1!=params[1]) {
alert("Incorrect Password!"); return; };
var page="";
for (var i=0;i<8;i++) {
letter=params[2].substring(i,i+1)
ul=letter.toUpperCase();
a=alpha.indexOf(ul,0);
a-=(h2.substring(i,i+1)*1);
if (a<0) a+=26;
page+=alpha.substring(a,a+1); };
top.location=page.toLowerCase()+".html";
}
function makehash(pw,mult) {
pass=pw.toUpperCase();
hash=0;
for (i=0;i<8;i++) {
letter=pass.substring(i,i+1);
c=alpha.indexOf(letter,0)+1;
hash=hash*mult+c;
}
return(hash);
}
// End -->
</script>
</textarea>
</form>
<SCRIPT LANGUAGE="JavaScript">
<!-- Begin
var params=new Array(4);
var script=document.js.scrpt.value;
var alpha="ABCDEFGHIJKLMNOPQRSTUVWXYZABCDEFGHI";
showmem(document.members);
function showmem(form) {
document.members.num.value=document.members.memlist.length;
var which=form.memlist.selectedIndex;
splt(form.memlist[which].value);
form.entry.value=which+1;
for (i=2;i<5;i++) {
form.elements[i].value=params[i-2]; };
}
function splt(choice) {
p=0;
for (i=0;i<3;i++) {
a=choice.indexOf("|",p);
params[i]=choice.substring(a,p);
p=a+1;
}
}
function addnew(form) {
newmem=getfields(form);
var who=prompt("New User's Name:","");
form.memlist[form.memlist.length] = new Option(who, newmem, false, true);
if (navigator.appName=="Netscape") {
document.js.scrpt.value=script;
history.go(0);
}
else {
showmem(document.members);
}
}
function getfields(form) {
newmem="";
for (i=2;i<5;i++) {
newmem+=form.elements[i].value+"|"; };
for (i=3;i<5;i++) {
a=form.elements[i];
for (k=0;k<8;k++) {
}
}
return(newmem);
}
function delthis(form) {
if (confirm("Delete "+form.memname.value+"?")) {
form.memlist.options[form.entry.value-1]=null;
form.message.value=form.memname.value+" Deleted";
form.memlist.selectedIndex=0;
if (navigator.appName=="Netscape") {
document.js.scrpt.value=script;
history.go(0);
}
else {
showmem(document.members);
}
}
}
function update(form) {
msg="no";
a=form.elements[i];
for (k=0;k<8;k++) {
b=a.value.substring(k,k+1);
c=b.toUpperCase();
form.memlist[form.entry.value-1].value=getfields(form);
form.message.value=form.memname.value+"'s record was updated";
}
}
function create(form) {
var html="<center><form name=login>\n";
html+="<table border=1 cellpadding=3>\n\n";
html+='<tr><td colspan=2 align=center><font size="+2">';
html+='<b>Members-Only Area!</b></font></td></tr>\n';
html+="<tr><td>Username:</td><td><select name=memlist>\n<option value='x'>";
for (j=0;j<form.memlist.length;j++) {
splt(form.memlist.options[j].value);
h1=makehash(params[1],3);
h2=makehash(params[1],10)+" ";
var page="";
for (var i=0;i<8;i++) {
letter=params[2].substring(i,i+1);
ul=letter.toUpperCase();
a=alpha.indexOf(ul,0);
a+=(h2.substring(i,i+1)*1);
page+=alpha.substring(a,a+1);
}
html+="\n<option value='"+params[0]+"|"+h1+"|"+page+"'>"+params[0];
};
html+="\n</select></td></tr>\n";
html+="<tr><td>Password:</td><td><input type=password size=10 maxlength=8 name=pass></td></tr>\n";
html+='<tr><td colspan=2 align=center><input type=button value="Login" onclick="check(this.form)"></td>\n';
html+="</tr>\n</table>\n</form>\n";
document.js.scrpt.value=html+script+"</center>";
}
function makehash(pw,mult) {
pass=pw.toUpperCase();
hash=0;
for (i=0;i<8;i++) {
letter=pass.substring(i,i+1);
c=alpha.indexOf(letter,0)+1;
hash=hash*mult+c;
}
return(hash);
}
// End -->
</script>
</center>
<p><center>
<font face="arial, helvetica" size="-2">Free JavaScripts provided<br>
by <a href="http://javascriptsource.com">The JavaScript Source</a></font>
</center><p>
<!-- Script Size: 6.50 KB -->
Last edited by Christian; 06-28-06 at 03:19 PM.
Reason: Added [code][/code] wrappers!