Creating a Simple PHP and MySQL-Based Login System

Creating a Simple PHP and MySQL-Based
Login System

Contents:
Ctrl+clink on a item to read

1. Files
2. Step 1 - Creating the Users Table & Adding a User
3. Step 2 - Create the Database Configuration File (includes/config.inc.php)
4. Step 3 - Create the Functions (includes/functions.inc.php)
5. Step 4 - Create the Login Script (includes/login.inc.php)
6. Step 5 - Create the Log Out Script (includes/logout.inc.php)
7. Step 6 - Create the Login Page (login.php)
8. Step 7 - Creating the Login Screen CSS File (css/login.css)
9. Step 8 - Creating the Admin Page (index.php)

Files
1. /login.php - Front-facing login screen
2. /index.php - Password-protected page
3. /css/login.css - CSS file for login screen
4. /includes/config.inc.php - Database configuration file
5. /includes/function.inc.php - Core functions
6. /includes/login.inc.php - Login script
7. /includes/logout.inc.php - Logout script

Step 1 - Creating the Users Table & Adding a
User
The following MySQL query will create the users table we will need to create the login system:

CREATE TABLE `tpc_tutorials`.ùsers` (

ìd` INT UNSIGNED NOT NULL AUTO_INCREMENT PRIMARY KEY ,

ùsername` VARCHAR( 20 ) NOT NULL ,

`password` VARCHAR( 32 ) NOT NULL ,

UNIQUE (

ùsername`

)

) ENGINE = MYISAM

• id - Each user is assigned a unique ID, AUTO_INCREMENT ensures that this automatically
increases with each user that is added.
• username - Each username must be unique and no greater than 20 characters.
• password - Because we will be using MD5 encryption, which produces unique strings with a
length of 32 characters, we have allowed this field a maximum of 32 characters.

Next, we will add a user to the users table:

INSERT INTO `tpc_tutorials`.ùsers` (

ìd` ,

ùsername` ,

`password`

)

VALUES (

NULL , 'admin', MD5( 'password' )

);

The MySQL statement above creates a user with admin as the username, and password as the
password. The MD5 command will encrypt the password in a 32-character string. If all is working
properly, you should end up with 5f4dcc3b5aa765d61d8327deb882cf99 in the password field.

Step 2 - Create the Database Configuration
File
(includes/config.inc.php)

In this step, we will create a configuration file that stores our MySQL database connection settings.
Creating a separate file for database settings helps if you have to change your MySQL username,
password, server, or database. Otherwise, you may end up having to make the same change over and
over again, which can be quite time-consuming. (I learned this the hard way!)

<?php

/**

* MySQL Database Configuration

*

* @file /includes/config.inc.php

* @note Replace the settings below with those for your MySQL database.

*/

define('DB_HOSTNAME', 'database_hostname');

define('DB_USERNAME', 'database_username');

define('DB_PASSWORD', 'database_password');

define('DB_DATABASE', 'database_name');

?>

Step 3 - Create the Functions
(includes/functions.inc.php)

The functions file includes those functions frequently used, and consolidating these help save time and
reduce code clutter. The key concepts illustrated in this part of the tutorial are:

• Functions & function commenting
• Use of header() for redirection

<?php

/**

* Crucial Functions for Application

*

* @package tpc_tutorials

* @file /includes/functions.inc.php

*/

/**

* Redirects to specified page

*

* @param string $page Page to redirect user to

* @return void

*/

function redirect($page) {

header('Location: ' . $page);

exit();

}

/**

* Check login status

*

* @return boolean Login status

*/

function check_login_status() {

// If $_SESSION['logged_in'] is set, return the status

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

return $_SESSION['logged_in'];

}

return false;

}

Step 4 - Create the Login Script (includes/login.inc.php)
The script we create during this step will be executed after we submit a username and password via the
login screen. Several key concepts will be illustrated in this step:

• Sanitizing data (making sure data is safe for database)

• Simple MySQL queries using the object-oriented MySQLi extension
• Including an external PHP file
• Use of $_SESSION variables

<?php

// Include required MySQL configuration file and functions

require_once('config.inc.php');

require_once('functions.inc.php');

// Start session

session_start();

// Check if user is already logged in

if ($_SESSION['logged_in'] == true) {

// If user is already logged in, redirect to main page

redirect('../index.php');

} else {

// Make sure that user submitted a username/password and username
only consists of alphanumeric chars

if ( (!isset($_POST['username'])) || (!isset($_POST['password'])) OR

(!ctype_alnum($_POST['username'])) ) {

redirect('../login.php');

}

// Connect to database

$mysqli = @new mysqli(DB_HOSTNAME, DB_USERNAME, DB_PASSWORD,
DB_DATABASE);

// Check connection

if (mysqli_connect_errno()) {

printf("Unable to connect to database: %s",
mysqli_connect_error());

exit();

}

// Escape any unsafe characters before querying database

$username = $mysqli->real_escape_string($_POST['username']);

$password = $mysqli->real_escape_string($_POST['password']);

// Construct SQL statement for query & execute

$sql = "SELECT * FROM users WHERE username = '" .
$username . "' AND password = '" . md5($password) . "'";

$result = $mysqli->query($sql);

// If one row is returned, username and password are valid

if (is_object($result) && $result->num_rows == 1) {

// Set session variable for login status to true

$_SESSION['logged_in'] = true;

redirect('../index.php');

} else {

// If number of rows returned is not one, redirect back
to login screen

redirect('../login.php');

}

}

?>

Step 5 - Create the Log Out Script
(includes/logout.inc.php)

There are two new PHP features introduced in this script: unset() and session_destroy().

• unset() - Unsets specified variable
• session_destroy() - Destroys all data registered to a session

<?php

// Start session

session_start();

// Include required functions file

require_once('functions.inc.php');

// If not logged in, redirect to login screen

// If logged in, unset session variable and display logged-out message

if (check_login_status() == false) {

// Redirect to

redirect('login.php');

} else {

// Kill session variables

unset($_SESSION['logged_in']);

unset($_SESSION['username']);

// Destroy session

session_destroy();

}

?>

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

<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">

<head>

<meta http-equiv="Content-type" content="text/html;charset=utf-8" />

<title>Creating a Simple PHP and MySQL-Based Login System -
dev.thatspoppycock.com</title>

</head>

<body>

<h1>Logged Out</h1>

<p>You have successfully logged out. Back to <a href="../login.php">login</a>
screen.</p>

</body>

</html>

Step 6 - Create the Login Page
(login.php)

The following HTML page is one example of how you can style and layout your login screen. The CSS
will be created in the next step, which can be edited to suit your needs.




<head>




font-family: 'Trebuchet MS', Verdana, Arial, sans-serif;

font-size: 10pt;

}

#login-form {

width: 300px;

margin: 0 auto;

}

#login-form fieldset {

padding: 10px;

}

#login-form legend {

font-weight: bold;

font-size: 9pt;

}

#login-form label {

display: block;

height: 2em;

background-color: #e7e7e7;

padding: 10px 10px 0;

}

#login-form input {

margin-right: 20px;

border: 1px solid #999;

float: right;

clear: right;

background: #ccc;

}

#login-form input:focus, #login-form input-hover {

border: 1px solid #333;

}

Step 8 - Creating the Admin Page
(index.php)

The first instruction we pass is session_start(), which allows us to use the $_SESSION variable to
access information. After that, we bring our library of functions so we can use the check_login_status()
and redirect() functions. The if statement in the code block redirects the user back to the login screen if
he/she is not logged in.

<?php

// Start session

session_start();

// Include required functions file

require_once('includes/functions.inc.php');

// Check login status... if not logged in, redirect to login screen

if (check_login_status() == false) {

redirect('login.php');

}

?>



<head>



</head>

<body>

<h1>Administration Panel</h1>

<p>You are currently logged in. You may log out using the button
below.</p>

<p><a href="includes/logout.inc.php">Log Out</a></p>

</body>

</html>

Creating a Simple PHP and MySQL-Based Login System

More Related Content

What's hot (20)

Similar to Creating a Simple PHP and MySQL-Based Login System (20)

Creating a Simple PHP and MySQL-Based Login System