Need Help passing username to 2nd page with cookie

Hello All,

I am in DESPERATE need of some help. I have two pages, page1.html and page2.html. I am trying to pass a person’s username in the most SECURE way possible. To my knowledge, cookies are the best way to do this. I would appreciate it if someone could help me out and possibly give me some type of example of how to set/get the username cookie from the form on the 1st page, and display it on the 2nd page (i.e. Welcome ‘username’). Please help. Thanks in advance. Here’s what I have:


<form name="login" method="post" action="page2.html">

<table class="blah" >
    <tr>
        <th>Username</th>
        <td><input type="text" name="login" size="15" value="" /></td>
    </tr>
    <tr>
        <th>Password</th>
        <td><input type="password" name="pass" size="15" /></td>
    </tr>
</form>

Page 2 should look something like this:


Welcome 'username' (pulled from page1's username input text box)

Again, thanks in advance.

I’m editing the files from the desktop. Now that I know js is no good for validation, should I convert the 2nd page to php?

Oh yes , of course !
If you need to perform any validation you HAVE to use a server script like php. You can never rely on html and javascript to perform authentication.

I’m sure it works, I tested it myself.

Are you using a localhost or an actual domain with a webserver? Or are you just clicking on the file to open it ?

Thanks for the help, but it’s not working. It’s just displaying Welcome with no username.

Well, the login page (page1.html) is login.php.htm. The welcome page (page2.html) is welcome.html. So, I’m not sure

But of course, as MunkyDesigns has already explained, this is not very much useful, and something like that is usually done with a server script like php, and usually uses something called sessions.

But obviously, it can be done in javascript as I showed you above. (Although I still don’t see much use for it).

page1.html:


<!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">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Untitled Document</title>
<script type="text/javascript">
window.onload=function()
{
	var username = document.getElementById('username').value;
	var button = document.getElementById('submit');
	button.onclick = function()
	{
		setCookie('username',username,1);
		window.location.href="page2.html";
	}
}

function setCookie(c_name,value,expiredays)
{
	var exdate=new Date();
	exdate.setDate(exdate.getDate()+expiredays);
	document.cookie=c_name+ "=" +escape(value)+
	((expiredays==null) ? "" : ";expires="+exdate.toUTCString());
}
</script>
</head>

<body>
Username
<input type="text" id="username" name="username" size="15" value="" />
<input type="button" id="submit" value="Next" />
</body>
</html>

page2.html :


<!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">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Untitled Document</title>
<script type="text/javascript">
window.onload = function()
{
	var username = getCookie('username');
	var span = document.getElementById('cookieSpan');
	span.innerHTML="Welcome "+username;
}

function getCookie(c_name)
{
if (document.cookie.length>0)
  {
  c_start=document.cookie.indexOf(c_name + "=");
  if (c_start!=-1)
    {
    c_start=c_start + c_name.length+1;
    c_end=document.cookie.indexOf(";",c_start);
    if (c_end==-1) c_end=document.cookie.length;
    return unescape(document.cookie.substring(c_start,c_end));
    }
  }
return "";
}
</script>
</head>

<body>
<span id="cookieSpan"></span>
</body>
</html>

I have a virtual machine with AMP installed and access to phpmyadmin. I just don’t know how to make a new php file or change to html to php

Correct me if I’m wrong, but doing this in js will pass any user along to the 2nd page regardless if their login information is right or not, right?

I’m not really sure you can do it, unless you use a cgi script but they can be a pain.

Can you definitely not use php or asp etc? It’d be so much easier.

It’s not that simple. You need to install a web server with php on your computer and start accessing the files you develop using a url like : http://localhost/page1.php

I suppose you have never worked with web development before (except maybe with static html pages).

I suggest you take an introductory tutorial like http://www.w3schools.com/php/php_intro.asp

If this doesn’t help you get started let me know.

to change html to php just rename the file to .php, not .html.

Best test is to create a file (test.php), and put this code in it:

<?php echo "Hello World"; ?>

When you access that page, if you can see “Hello World” php is installed and working.

I’m using JavaScript. I’ve read the section on W3C about cookies, but I’m still confused on how to do this in regards to what I’m trying to accomplish.

What language are you using? You could do this quite easily in php (using what’s known as POST).

However, you’ve posted in the Javascript section, so the best place to look for this would be this link http://www.w3schools.com/JS/js_cookies.asp