Simple Password Protection on DW page

Report · Dec 17, 2009

Hi, I am trying to employ a simple password-only protection to some pages on a website I'm building. I've found what should be the appropriate code at this site: http://javascriptkit.com/script/cut10.shtml

Here is their sample code, password only with a simple popup window to enter the password:

<SCRIPT>
function passWord() {
var testV = 1;
var pass1 = prompt('Please Enter Your Password',' ');
while (testV < 3) {
if (!pass1)
history.go(-1);
if (pass1.toLowerCase() == "letmein") {
alert('You Got it Right!');
window.open('protectpage.html');
break;
}
testV+=1;
var pass1 =
prompt('Access Denied - Password Incorrect, Please Try Again.','Password');
}
if (pass1.toLowerCase()!="password" & testV ==3)
history.go(-1);
return " ";
}
</SCRIPT>
<CENTER>
<FORM>
<input type="button" value="Enter Protected Area" onClick="passWord()">
</FORM>
</CENTER>

The difference is that instead of the centered input = button their sample has on the javascriptkit.com page, I'd like the form to be launched from the click of my Log In button I have in my design – or from clicking on the links for the three pages named: 'membermeetings.htm', 'boardmemberscommittee.htm', 'news_n_photos.htm'. Am I missing a <Form> wrap?

I could also use some tips on where and how much code to put into my <body> section; all of it, part of it?

Here is the code I entered in by adding "Call JavaScript" in behaviors:

onclick="MM_callJS('(\'function passWord() { var testV = 1; var pass1 = prompt(\\\'Please Enter Your Password\\\',\\\' \\\'); while (testV < 3) { if (!pass1) history.go(-1); if (pass1.toLowerCase() == \\"community\\") { alert(\\\'Welcome!\\\'); window.open(\\\'membermeetings.html\\\',\\\'boardmemberscommittee.htm\\\',\\\'news_n_photos.htm\\\'); break; } testV+=1; var pass1 = prompt(\\\'Access Denied - Password Incorrect, Please Try Again.\\\',\\\'Password\\\'); } if (pass1.toLowerCase()!=\\"password\\" & testV ==3) history.go(-1); return \\" \\"; }

Thanks in advance for your help! Brent

Report · Dec 17, 2009

The page is NOT safely protected because anyone can easily find the password by looking at the pages source code in any browser.

You need to look for a simple php solution or one of the other server languages like asp, coldfusion if you really want to protect the page.

Report · Dec 17, 2009

Here's a simple php solution which uses a Username (Pink) & Password (Elephant) combination. If the user gets the combination correct they are shown a link to the 'protected page', if they get it wrong they get a message asking them to 'go away'. You need your server to be running php to be able to use this method. It's safer than javascript because you can't get access to the Username or Password by looking the source 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">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<title>Password Protected</title>
<?php
if (array_key_exists('ewTest' , $_POST)) {
$username = trim($_POST['username']);
$password = trim($_POST['password']);
if (($username == "Pink") && ($password == "Elephant"))
{
$response = "Youre welcome! <a href='http://www.bbc.co.uk'>Enter Here</a>";
}
else {
$response = "Go away!";
}
}
?>
</head>

<body>

<form id="form1" name="form1" method="post" action="passtest.php">
<label>Username</label><br />
<input type="text" name="username" id="username" value=""/><br />
<label>Password</label><br />
<input type="text" name="password" id="password" value=""/><br />
<input type="submit" name="ewTest" id="submit" value="Submit" />
</form>
<p>
<?php if(isset($response)) echo $response;?>
</p>

</body>
</html>

Report · Dec 17, 2009

Thanks! Will this work on multiple pages? If so, how much of the

code (and which pieces/where) do I paste into the page codes?

I am trying to put a 'mild' protection on three pages of my website.

Thanks,

Brent DeWitt

DeWitt Design

216.534.6397

Report · Dec 17, 2009

dewdezyn wrote:
Thanks! Will this work on multiple pages? If so, how much of the
code (and which pieces/where) do I paste into the page codes?
I am trying to put a 'mild' protection on three pages of my website.
Thanks,
Brent DeWitt
DeWitt Design
216.534.6397

Yes it works on multiple pages. You would just duplicate the page, rename it something else and link the next page you want protected to it (read below)

Below is a page which has been styled up a bit more (see code below)

All you do is copy the whole of the code. Insert it into a new Dreamweaver document and save it as passwordProtected.php (remember this will only work if you have php running on your host server i.e., the server that your website is hosted on).

Link the first page you want protected to the 'passwordProtected.php' file.

You can change the 'username' & 'password' to anything you like. Just look for the line below in the code and change "Pink" & "Elephant" to what you require.

if (($username == "Pink") && ($password == "Elephant"))

Look for this line below and change 'http://www.bbc.co.uk' to the webpage you want protected.

$response = "Youre welcome! <a href='http://www.bbc.co.uk'>Enter Here</a>";

If you want to protect multiple pages just duplicate the 'passwordProtected.php' file, rename it something like 'passwordProtected_2.php', link your next protected page to it and change the url address in the php code.

Here is the complete page 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">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<title>Untitled Document</title>
<?php
if (array_key_exists('ewTest' , $_POST)) {
$username = trim($_POST['username']);
$password = trim($_POST['password']);
if (($username == "Pink") && ($password == "Elephant"))
{
$response = "Youre welcome! <a href='http://www.bbc.co.uk'>Enter Here</a>";
}
else {
$response = "Sorry, you do not have permission to access this webpage!";
}
}
?>
<style type="text/css">
#wrapper {
width: 250px;
padding: 20px;
margin: 20px auto;
background-color:#CCC;
font-family: verdana, arial, helvetica, sans-serif;
font-size: 11px;
}
#wrapper p {
margin: 0 0 0 0;
padding: 0;
text-align: center;
}
input {
width: 250px;
}
input#submit {
width: 100px;
margin: 15px 0 0 0;
}
</style>
</head>

<body>

<div id="wrapper">
<p style="margin-bottom: 10px;">Please enter your Username & Password below. (Case sensitive)</p>
<form id="form1" name="form1" method="post" action="passtest.php">
<label>Username</label><br />
<input type="text" name="username" id="username" value=""/><br />
<label>Password</label><br />
<input type="text" name="password" id="password" value=""/><br />
<input type="submit" name="ewTest" id="submit" value="Submit" />
</form>
<p style="margin-top: 10px;">
<?php if(isset($response)) echo $response;?>
</p>
</div>

</body>
</html>

Report · Dec 22, 2011

Hi Brent,

in addition to osgood_'s hint: The easiest way - in my opinion - to protect the recommended website(s) with a password is to ask your provider for this possibility. I can show you here the menu of my German host (Passwortschutz > Password protection):

Hans-Günter

Report · Dec 22, 2011

Good stuff Hans but I'm only interested in protecting one specific page within the website and not the website access i.e you go to my site www.tri-pirates.com and click on Pirates Only from the main menu. This action opens the PHP file where the user name and password has to be entered. So far so good but once I click on the Submit button, all I get is the page with No file input specified

Report · Dec 22, 2011

julioys wrote:
Good stuff Hans but I'm only interested in protecting one specific page within the website and not the website access i.e you go to my site www.tri-pirates.com and click on Pirates Only from the main menu. This action opens the PHP file where the user name and password has to be entered. So far so good but once I click on the Submit button, all I get is the page with No file input specified

I see what you mean about no file input specified......unfortunately that could mean anything.

Are you sure php is running on your remote server? Have you done some simple tests?

Create a new php page and insert the below between the <body> tags:

<?php

echo "Hello World";

?>

If php is running then the page will return Hello World. At least that would establish that php is running.

If that works then have you tested the script on a different server as it may be that the server is not set up correctly.

If both the above fail then you have done something wrong somewhere. Looking at your code its a bit all over the place which might upset the script running.

I would copy the original script/coding and paste that in a new Dreamweaver page and test that first. If that works then you have made an error. If it doesn't then your host server is not set up correctly to run php.

If I remember Hans did test the original script out on his server and it ran correctly.

Report · Dec 22, 2011

Hello,

here the links to my two test versions:

http://hansgd.de/AdobTest/dataBase/passtestAdz.php > without "additional code" and

http://hansgd.de/AdobTest/dataBase/passtestAdzS.php > with "additional code".

Feel free to use the source code(s).

Hans-Günter

Report · Jan 31, 2013

I know your above post is kinda old but is there any way you can make those 2 above links work? I'm attempting the same project and about to pull ALLL my hair out...

Also when I tried your Hello World test to see if PHP is running on my server, I keep getting the following message:

500: Internal server error

This error is generated when a script running on the server could not be implemented or permissions are incorrectly assigned for files or directories

Troubleshooting suggestions:

Temporarily disable any rewrite rules by renaming your .htaccess file if it exists.

Ensure that any CGI or Perl scripts have at least .755. permissions.

If trying to run PHP and you get this error, you may have an invalid php.ini in your /cgi-bin, or may be missing your php.dat file in this folder.

SO... is there supposed to be a php.dat file inside the directory where I placed my placed my test php page? (my tiny page just to run the test like in your above post for hello world) because there is only a php.dat file in my cgi-bin in my root folder...

Report · Jan 31, 2013

Ok I got the Hello World test to work! yeah small victory, now have to work on the rest of it... I had the test page for the Hello World in a different directory and I think it was missing that php.dat file... omg

Report · Jan 31, 2013

No php.dat file needed.......infact I don't know what it is.

Hello World.....at least it means you have a php enabled server.

Looking at the above posts the below code is all you need. Save it as passtest.php. This will send the username and password to be procesed. If the combination is Pink for the username & Elephant for the password you will be invited to go to the password protected page (which at the moment is set to go to http://www.bbc.co.uk. You can change that and the username/password in the code below.

Please as a security measure include the code, which I will post in a seperate reply, at the top of the password protected page. If anyone happens to stumble upon the page if the username and password are not set it will take them back to the sign in page.

<?php session_start() ?>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<head>

<title>Untitled Document</title>

<?php

if (array_key_exists('ewTest' , $_POST)) {

$username = trim($_POST['username']);

$_SESSION['username'] = $username;

$password = trim($_POST['password']);

$_SESSION['password'] = $password;

if (($username == "Pink") && ($password == "Elephant"))

{

$response = "Youre welcome! <a href='http://www.bbc.co.uk'>Enter Here</a>";

}

else {

$response = "Sorry, you do not have permission to access this webpage!";

}

?>

#wrapper {

width: 250px;

padding: 20px;

margin: 20px auto;

background-color:#CCC;

font-family: verdana, arial, helvetica, sans-serif;

font-size: 11px;

}

#wrapper p {

margin: 0 0 0 0;

padding: 0;

text-align: center;

}

input {

width: 250px;

}

input#submit {

width: 100px;

margin: 15px 0 0 0;

}

</style>

</head>

<body>

<p style="margin-bottom: 10px;">Please enter your Username & Password below. (Case sensitive)</p>

<label>Username</label><br />

<label>Password</label><br />

</form>

<?php if(isset($response)) echo $response;?>

</p>

</div>

</body>

</html>

Report · Jan 31, 2013

Insert the following bit of php code at the very top of the page you want password protected (before anything else), Change http://www.yourDomainName.com to where the passtest.php login file is located on your server. remote or locally if testing.

<?php session_start() ?>

<?php

if (!isset($_SESSION['username']) && !isset($_SESSION['password'])) {

header("Location: http://www.yourDomainName.com/passtest.php");

}

if (isset($_SESSION['username'])) {

unset($_SESSION['username']);

session_destroy();

}

if (isset($_SESSION['password'])) {

unset($_SESSION['password']);

session_destroy();

}

?>

Report · Feb 01, 2013

I got it working! THANK YOU SO MUCH!!

Adobe forums ROCK

Report · Feb 02, 2013

OK ONE more question regarding my password protected page...

(ok nobody shoot me here because maybe this should have been a whole new topic; BUT it is directly related to my above posts for password protection)

I was just wondering, can search engines see or crawl this 'protected page' which has a .php extension or do I have to make a robot.txt / disallow ?? I really don't want that page being searched because it is for members only and doesn't need to be searched...

Report · Feb 02, 2013

Sure a search engine can crawl the page BUT as it's protected by the code (see below) that you should have inserted at the top of it no-one but those with a password and username can access it even if it is listed.

<?php session_start() ?>

<?php

if (!isset($_SESSION['username']) && !isset($_SESSION['password'])) {

header("Location: http://www.yourDomainName.com/passtest.php");

}

if (isset($_SESSION['username'])) {

unset($_SESSION['username']);

session_destroy();

}

if (isset($_SESSION['password'])) {

unset($_SESSION['password']);

session_destroy();

}

?>

Report · Sep 11, 2013

This worked great for me, now for some reason I see the page as expected when logged in, but I get this line of text at the top...

Warning: session_destroy() [function.session-destroy]: Trying to destroy uninitialized session in (server path to file)/index.php on line 13

Line 13 is the second session_destroy on that page...

<?php session_start() ?>

<?php

if (!isset($_SESSION['username']) && !isset($_SESSION['password'])) {

header("Location: http://www.mysite.com/folder/passtest.php");

}

if (isset($_SESSION['username'])) {

unset($_SESSION['username']);

session_destroy();

}

if (isset($_SESSION['password'])) {

unset($_SESSION['password']);

session_destroy();

}

?>

Am I missing something simple?

Report · Sep 11, 2013

From php manual:

session_destroy() destroys all of the data associated with the current session. It does not unset any of the global variables associated with the session, or unset the session cookie.

So you'll need to rewrite your code slightly so the session_destroy is called only once.

Report · Sep 11, 2013

And there's my issue...

I, how should I say this delicately, I royally suck at PHP, beyond setting up includes and a few other "we train monkeys to do this at our company because it's cheaper than paying a programmer" php functions, I get lost.

I was hoping someone could shed some light on the error because it had worked in the past for a time (using what Osgood had posted above) and now gives the error I mention.

Report · Oct 31, 2014

Thanks to Chris_DLT on a TechSoup forum for leading me here!

Okay... I have somewhat figured out this out... scary. I opened a new php page in DW and copied all the code... changed the URLs where needed and voila! Wow...

Now, I need to put a button / hot link on the template and that button should go to the .../passtest.php page, correct?

Linette

Report · Oct 31, 2014

redtail_soar wrote:

Now, I need to put a button / hot link on the template and that button should go to the .../passtest.php page, correct?

Linette

Yes, that's correct 'click to login' - link it to passtest.php

Be sure to insert the following bit of php code at the top of your page/s you what protected, before any other code on the page. That way if someone stumbles upon them while surfing and the username and password is not set it will take them to the login page.

<?php session_start() ?>

<?php

if (!isset($_SESSION['username']) && !isset($_SESSION['password'])) {

header("Location: http://www.yourDomainName.com/passtest.php");

}

if (isset($_SESSION['username'])) {

unset($_SESSION['username']);

session_destroy();

}

if (isset($_SESSION['password'])) {

unset($_SESSION['password']);

session_destroy();

}

?>

Report · Oct 31, 2014

Yes... I saw that bit of code in the thread and added that at the start of the page code.

Can two password-protected pages on one site be built like this? How would that work? If yes, then would one set of code need to have a name change?

For example... volunteers log in - passtest.php and staff log in - passtest2.php?

I'm sure these are very simple questions for someone who understands php code!

Linette

Report · Oct 31, 2014

redtail_soar wrote:

Yes... I saw that bit of code in the thread and added that at the start of the page code.

Can two password-protected pages on one site be built like this? How would that work? If yes, then would one set of code need to have a name change?

Sure,

Just include the url you want to send the staff or volunteers to. In the example below if you enter Pink/Elephant as the username/password combination you get access to the staff.html page. If you enter Blue/Sea as the username/password combination you get access to the volunteers.html page

if (array_key_exists('ewTest' , $_POST)) {

$username = trim($_POST['username']);

$password = trim($_POST['password']);

if (($username == "Pink") && ($password == "Elephant"))

{

$response = "Welcome! <a href='staff.html'>Enter Here</a>";

}

elseif (($username == "Blue") && ($password == "Sea"))

{

$response = "Welcome! <a href='volunteers.html'>Enter Here</a>";

}

else {

$response = "Sorry, access is denied!";

}

?>

Obviously this is a very simplistic login system whereby each set of people - staff or volunteers get the same username/password. For anything more sophisticated you would need a database to store usernames and passwords.

Report · Oct 31, 2014

Well you could build a switch() system that would work for multiple users, but for more than a few dozen users at the most you would run out of energy entering all of the case statements! Then you'd really have to use a database.

Report · Oct 31, 2014

MurraySummers wrote:

Well you could build a switch() system that would work for multiple users, but for more than a few dozen users at the most you would run out of energy entering all of the case statements! Then you'd really have to use a database.

Well yeah you could use a dozen or even twenty or more elseif conditions but its not very pretty. I'd most likely use it if I only had a dozen people who wanted individual passwords, like clients because its not worth building a database in that sort of instance.

Simple Password Protection on DW page

1 Correct answer