Help Needed Urgently with JS Login Script!

semendemon · #1 (**permalink**) 11-21-07, 11:30 PM

Hey guys, I am having a problem with a simple login Javascript page that I made, which works fine and loads its "success page" (which is the page that it goes to when the login entered is correct) perfectly on my computer. However, when I upload it, the script runs fine up to the point where the login is checked for validity (it even displays an error dialog when your login is incorrect and you press login, so the button is working somewhat), but it DOES NOT go to the success page it is supposed to. It just stops. I checked the script and could not a find a "break" in the operation that could be causing it (again, it works fine on my computer). What do you guys think could be the problem? My domain host (just in case it might be the cause of the problem) is GeoCities (yes, I'm a broke student, lol).

A little about the overall website: I have made a website for my school project (which is starting a new business). The website is www.txtmobility.2ya.com if you guys want to test the hosted login page out for yourselves. Just go under the login menu and select one of the pages. They are all using the same scripts as the BusinessLogin script that is shown below.

Thanks A LOT for your help in advance, guys.

BusinessLogin.html Code:

HTML Code:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<!-- DW6 -->
<head>
<script type="text/javascript" src="flashobject.js"></script>
<script type="text/javascript" src="BusinessLogin.js"></script>
<!-- Copyright 2005 Macromedia, Inc. All rights reserved. -->
<title>TXT® Mobility: TXT® Business Registration</title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<link rel="stylesheet" href="mm_lodging1.css" type="text/css" />
</head>
<body bgcolor="#999966">
<table width="100%" border="0" cellspacing="0" cellpadding="0">
	<tr>
	<td width="15" nowrap="nowrap">&nbsp;</td>
	<td height="60" colspan="2" class="logo" nowrap="nowrap">TXT<sup>®</sup> Mobility</td>
	<td width="311">&nbsp;</td>
  </tr>

	<tr bgcolor="#ffffff">
	<td colspan="4"><img src="mm_spacer.gif" alt="" width="1" height="1" border="0" /></td>
	</tr>

	<tr bgcolor="#a4c2c2">
	<td width="15" nowrap="nowrap">&nbsp;</td>
	<td height="36" id="navigation" class="navText">
    <div id="color_id" >123 Flash Menu Placeholder.</div>
	<script type="text/javascript">
var fo = new FlashObject("MenuBar.swf","color","704","100","6","#FFFFFF");
    fo.addParam("menu","false");
    fo.addParam("quality","best");
    fo.addParam("scale","noscale");
    fo.addParam("salign","LT");
    fo.addParam("wmode", "transparent");
    fo.write("color_id");
</script></td>
	<td>&nbsp;</td>
	<td width="311">&nbsp;</td>
  </tr>

	<tr bgcolor="#ffffff">
	<td colspan="4"><img src="mm_spacer.gif" alt="" width="1" height="1" border="0" /></td>
	</tr>

	<tr bgcolor="#ffffff">
	<td valign="top" width="15"><img src="mm_spacer.gif" alt="" width="15" height="1" border="0" /></td>
	<td valign="top" width="672"><img src="mm_spacer.gif" alt="" width="35" height="1" border="0" />
	  <table width="100%" height="280" cellpadding="3" cellspacing="0">
        <tr>
          <td width="100%" height="40"><h2>TXT<sup>®</sup> Business<sup></sup> Login</h2></td>
        </tr>
        <tr>
          <td align="left"><script language="JavaScript">
  BuildPanel();
 </script></td>
        </tr>
      </table></td>
	<td width="4" valign="top"><br />
	  &nbsp;<br />	</td>
	<td>&nbsp;</td>
	</tr>

	<tr>
	<td width="15">&nbsp;</td>
    <td width="672">&nbsp;</td>
    <td width="4">&nbsp;</td>
	<td width="311">&nbsp;</td>
  </tr>
</table>
</body>
</html>

BusinessLogin.js Code:

Javascript Code:

//----------------------------------------------------------------
//  Usernames, Passwords & User Pages - These require configuration.
//----------------------------------------------------------------
var successpage = "BusinessOnline.html"; // The page users go to after login, if they have no personal page.
var loginpage = "BusinessLogin.html"; //Change this to the page the login panel is on.
 
var imgSubmit = ""; //Change to the path to your login image,if you don't want the standard button, otherwise do not change.
var imgReset = "";  //Change to the path to your reset image,if you don't want the standard button, otherwise do not change.
 
var users = new Array();
 
users[0] = new Array("schulich","class2011","BusinessOnline.html"); // Change these two entries to valid logins.
// Add addtional logins, straight after these, as
// required, followig the same format. Increment the 
// numbers in the square brackets, in new each one. Note:
// the 3rd parameter is the the page that user goes to
// after successful login. Ensure the paths are correct.
                                                           // Make this "" if user has no personal page.
//----------------------------------------------------------------
//  Login Functions
//----------------------------------------------------------------
function login(username,password){
 var member = null;
 var loggedin = 0;
 var members = users.length;
 for(x=0;x<members && !loggedin; x++){
 if((username==users[x][0])&&(password==users[x][1])){
    loggedin = 1;
    member = x;
    break; // User validated, terminate the for loop.
   }
 } 
 
 if(loggedin==1){
  if(users[member][2] != "") {
   successpage = users[member][2];
  }
  setCookie("login",1);
  if (top.location.href != location.href){
   location.href = successpage;           
  }else{
   top.location.href = successpage;  
  }
 }else{
  alert('User name or password is incorrect. Please try again.');
 }  
}
 
function logout() {
 deleteCookie("login");
 if (top.location.href != location.href){
  location.href = loginpage;           
 }else{
  top.location.href = loginpage;  
 }
}
 
//----------------------------------------------------------------
// Cookie Handler
//----------------------------------------------------------------
var ckTemp = document.cookie;
 
function setCookie(name, value) { 
 if (value != null && value != "")
  document.cookie=name + "=" + escape(value) + ";";
 ckTemp = document.cookie;
 }
 
function deleteCookie(name) {
  if (getCookie(name)) {
    document.cookie = name + "=" +
    "; expires=Thu, 01-Jan-70 00:00:01 GMT";
  }
}
 
function getCookie(name) { 
 var index = ckTemp.indexOf(name + "=");
 if(index == -1) return null;
  index = ckTemp.indexOf("=", index) + 1;
 var endstr = ckTemp.indexOf(";", index);
 if (endstr == -1) endstr = ckTemp.length;
 return unescape(ckTemp.substring(index, endstr));
 }
  
function checkCookie() {
 var temp = getCookie("login");
 if(!temp==1) {
  alert('You must be logged in to view this page.'); 
  if(top.location.href != location.href){
   location.href = loginpage;           
  }else{
   top.location.href = loginpage;  
  }
 }
}
 
//----------------------------------------------------------------
// Login Panel
//----------------------------------------------------------------
 
function BuildPanel() {
document.write('<form name="logon"><table align="left" border="0"><tr><td align="right">');
document.write('<small><font face="Verdana">Username:</font></small></td>');
document.write('<td><small><font face="Verdana"><input type="text" name="username" size="20"></font></small></td></tr>');
document.write('<tr><td align="right"><small><font face="Verdana">Password:</font></small></td>');
document.write('<td><small><font face="Verdana"><input type="password" name="password" size="20"></font></small></td></tr>');
if(imgSubmit == ""){
 document.write('<tr><td align="center" colspan="2"><p><input type="button" value="Login" name="Logon" onclick="login(username.value,password.value)">'); 
} else {
 document.write('<tr><td align="center" colspan="2"><p><input type="image" src="'+imgSubmit+'" name="Logon" onclick="login(username.value,password.value)">');
}
if(imgReset == ""){
 document.write('<input type="reset" value="Reset" name="Reset">');
} else {
 document.write('<input type="image" src="'+imgReset+'" name="Reset" onclick="logon.reset();">');
}
document.write('</p></td></tr></table></form>');
}

mab · #2 (**permalink**) 11-22-07, 02:49 AM

Javascript cannot be used to create a login function. Anything that you do in the browser can be viewed by the visitor and is not secure. For example, you did not really need to post the code for BusinessLogin.js because anyone can get it from the web site itself. They can see the URL of the successful login page and enter that directly without ever bothering to enter any username or password. All the usernames and passwords are also visible in the code and any visitor would know all the usernames and passwords for everyone that you have set the site up for. If someone used the same username and password on your site that they use elsewhere, someone now knows what all those values are. Maintaining the list of usernames and passwords also requires changing the actual .js file every time you add, modify, or remove a value.

A secure login function can only really be done on the server, where the usernames and passwords are stored out of the hands of a visitor.

mab · #3 (**permalink**) 11-22-07, 03:22 AM

Here is an edit to the above post:

The disclaimer that the author of that login script includes in the source probably should have been included in your post above -

Quote:

DISCLAIMER: Use this script with caution. This script is not
the most secure method available, for protecting material. Its
main purpose is to demonstrate the javascript techniques used.
The author takes no responsibility for data loss
resulting from the use of this script.

Only the wording should have been -

"DISCLAIMER: Do not use this script. This script is not secure.
It does not protect anything. Its
main purpose is to demonstrate the javascript techniques used.
The author takes no responsibility for data loss
resulting from the use of this script."

semendemon · #4 (**permalink**) 11-22-07, 06:56 AM

I am FULLY AWARE of the insecurity of this script. I am not a newbie extreme, lol. This is just for demo purposes only and I need the login to work, so can you guys please help and try to find out why it is not working? I personally would not use anything other than PHP (screw IIS) for my REAL company login pages, but right now, I am just a student and can barely afford a good meal (much less an expensive SQL server).

Please help me out, guys. Thanks a lot in advance!

TwoD · #5 (**permalink**) 11-25-07, 11:54 AM

As I'm sure you understand, I agree with Mab about using a script like this, even for a demo page. (Is't security a part of what you wish to demo?

)

I couldn't test the login on the demopage (nothing happend when I clicked the login links, found no relevant error except for an XML syntax error and something which might be GeoCities ad-related).

If something works locally, but now when put on a server (and it's not using lots of AJAX or similar) it might be because GeoCities inserts ad-related code here and there, breaking the syntax and disturbing scripts. I've not had time to go through the code line by line, but it would help if you mentioned which error you got, and where.

mab · #6 (**permalink**) 11-25-07, 12:24 PM

There are free hosts, with no-ads, that offer php/mysql, just search.

When you tested this locally, were you going through a web server installed on your development computer or were you browsing directly to the file(s) through the file system?