I once heard a quote that went something along the lines of, “Write the kind of article you were searching for, but couldn’t find.” This is that article.
As I was perusing Google, I was searching for a super-simple “Remember Me” checkbox that I could implement on a client’s website in PHP. While there were quite a few results, I wasn’t impressed with the solutions I was finding, so I decided to create my own.
Note: If you don’t already have a good web host, I highly recommend BlueHost. I’ve partnered with them to get you an introductory rate of $3.95/month.
For the sake of simplicity, I have dumbed the files down significantly. Please realize that these are not the best practices in terms of security. They simply help demonstrate how the process of implementing cookies work. Please use industry best standards for password hashing.
To demonstrate, I have three PHP files: login.php
, index.php
, and logout.php
.
The files essentially work like this: The user navigates to index.php
. If a cookie exists in their browser still, it allows them to log into the Dashboard, as expected, without having to re-enter a password. If no cookie is found, it redirects them to login.php
, where they can then log in. After recreating the cookie, it will expire 7 days from the time it was created.
Upon successful login, users will see the dashboard:
index.php
:
<?php
//Set password
$pass = "foobar";
// If the cookie is found containing the hashed password
// continue to the index page. Otherwise, redirect the user
// to the login screen
if (isset($_COOKIE['passwordCookie'])) {
if ($_COOKIE['passwordCookie'] == md5($pass)) {
//do nothing, show the index.php page
} else {
header('Location: login.php');
}
} else {
header('Location: login.php');
}
?>
<!DOCTYPE html>
<html>
<head>
<title>Dashboard</title>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1"/>
<meta name="theme-color" content="#ffffff">
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/bulma/0.6.2/css/bulma.min.css">
</head>
<body>
<section class="hero is-primary is-bold">
<div class="hero-content">
<div class="container">
<h1 class="title">
Dashboard
</h1>
</div>
</div>
</section>
<section class="section">
<div class="container">
<h1 class="title">Yay! You're logged into the dashboard.</h1>
<p><a href="logout.php">Logout</a></p>
</div>
</section>
</body>
</html>
login.php
:
<?php
// Set the password
$pass = 'foobar';
// If a password was supplied from the login form
// and it matches our set password, set the cookie
if (isset($_POST['password'])) {
if ($_POST['password'] == $pass) {
if (isset($_POST['rememberme'])) {
/* Set cookie to last 1 week */
setcookie('passwordCookie', md5($_POST['password']), time()+60*60*24*7);
} else {
/* Cookie expires when browser closes */
setcookie('passwordCookie', md5($_POST['password']), false);
}
header('Location: index.php');
} else {
// If password is wrong, redirect to the same page, showing an error
header('Location: login.php?msg=1');
}
}
?>
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>Dashboard Login</title>
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/bulma/0.6.2/css/bulma.min.css">
<script defer src="https://use.fontawesome.com/releases/v5.0.6/js/all.js"></script>
</head>
<body>
<section class="hero is-primary is-bold">
<div class="hero-body">
<div class="container has-text-centered">
<h1 class="title">
Dashboard Login
</h1>
<h2 class="subtitle">
Please log in
</h2>
</div>
</div>
</section>
<section class="section">
<div class="container">
<div class="columns">
<div class="column is-3 is-offset-two-fifths">
<div class="field">
<form name="login" method="post" action="login.php">
<label class="label">Enter Password</label>
<div class="control">
<input class="input" name="password" type="password" placeholder="Password">
</div>
<?php if ($_GET['msg']==1) { echo "<p class="help is-danger">Incorrect Password</p>"; } ?>
</div>
<div class="field">
<div class="control">
<label class="checkbox">
<input type="checkbox" name="rememberme" value="1">
Remember me for 7 days
</label>
</div>
</div>
<div class="field">
<div class="control">
<button class="button is-link" type="submit">Submit</button>
</div>
</form>
</div>
</div>
</div>
</div>
</section>
</body>
</html>
logout.php
:
<?php
// set the cookie to a negative value (which 'unsets' it) and return
// to the login screen
setcookie('passwordCookie', '', time()-60*60*24*365);
header('Location: login.php');
?>
That’s it! An uber-simple straightforward “Remember Me” checkbox created in PHP.