This is an example of a combined Login and Registration application using PHP and MySQL database server. If you are looking for simple login and Registration individual applications, click on the respective links.
This application has the following features.
- Consists of both login and signup functionality.
- A user can upload a profile picture during the registration process.
- Form validations have been included.
- The password has been encrypted using the password_hash() method while inserting it into the MySQL database server during the registration process.
- A logged-in user can update his personal details.
Let us build this application step by step.
Step 1: The application begins with the index.php which contains a link for Login and Signup.
Step 2: In order to login to an application a user must be registered first. So, click on the Signup form and fill in all the details. The signup.php file features the registration form.
Step 3: Once you submit the signup form, as per the action attribute signup.inc.php gets called which contains the form fields validations and the business logic to insert to the user registration details into the MySQL database server. The signup.inc.php file internally makes a call to dbh.inc.php to establish a connection with MySQL database server.
Step 4: Once the registration is successful, the user can use the same credentials to log-in to the application. In this example, the header.php file contains the Login form.
Step 5: When the user keys-in correct credentials in the Login form, the control is sent to the login.inc.php as this is mentioned in the action attribute of the form tag. Here the credentials are evaluated by matching the user login details with that of stored in the MySQL database. If the user credentials match perfectly, a success message is sent to the index.php otherwise a failure message. The logged-in user can click on the Logout button to come out of the application. The logout.inc.php file contains the logout logic.
Step 6: Further, a logged-in user can update the profile details by clicking in Edit-Profile. The edit profile code is implemented inside edit-profile.php. One the user submits the form, the details will be passed on to the profileUpdate.inc.php where the modified records are updated into the MySQL database.
How to run this application?
You can use any PHP supported servers to run this application. To name a few WAMP, XAMPP, AppServ, etc. All these PHP servers include MySQL servers and also the phpMyAdmin dashboard. phpMyAdmin dashboard can be used to create the database server and table structure.
index.php
< ?php
define('TITLE',"Home | Complete Registertion From");
include 'includes/header.php';
?>
<div id="philosophy">
<hr />
<br /><br />
<h1>Advanced Login and Registration Application</h1>
<br /><br />
<p> Let us walk you through Complete Login and Registration Application using PHP and MySQL</p>
<br /><br /><br />
</div>
< ?php
include 'includes/footer.php';
?>
signup.php
//signup.php
< ?php
define('TITLE',"Signup");
include 'includes/header.php';
if(isset($_SESSION['userId']))
{
header("Location: index.php");
exit();
}
?>
<div id="contact">
<hr />
<h1>Signup</h1>
< ?php
$userName = '';
$email = '';
if(isset($_GET['error']))
{
if($_GET['error'] == 'emptyfields')
{
echo '<p class="closed">*Fill In All The Fields';
$userName = $_GET['uid'];
$email = $_GET['mail'];
}
else if ($_GET['error'] == 'invalidmailuid')
{
echo '<p class="closed">*Please enter a valid email and user name</p>';
}
else if ($_GET['error'] == 'invalidmail')
{
echo '<p class="closed">*Please enter a valid email</p>';
}
else if ($_GET['error'] == 'invaliduid')
{
echo '<p class="closed">*Please enter a valid user name</p>';
}
else if ($_GET['error'] == 'passwordcheck')
{
echo '<p class="closed">*Passwords donot match</p>';
}
else if ($_GET['error'] == 'usertaken')
{
echo '<p class="closed">*This User name is already taken</p>';
}
else if ($_GET['error'] == 'invalidimagetype')
{
echo '<p class="closed">*Invalid image type. Profile image must be a .jpg or .png file</p>';
}
else if ($_GET['error'] == 'imguploaderror')
{
echo '<p class="closed">*Image upload error</p>';
}
else if ($_GET['error'] == 'imgsizeexceeded')
{
echo '<p class="closed">*Image too large</p>';
}
else if ($_GET['error'] == 'sqlerror')
{
echo '<p class="closed">*Website Error: Contact admin to have the issue fixed</p>';
}
}
else if (isset($_GET['signup']) == 'success')
{
echo '<p class="open">*Signup Successful. Please login from the Login menu on the right</p>';
}
?>
<form action="includes/signup.inc.php" method='post' id="contact-form" enctype="multipart/form-data">
<input type="text" id="name" name="uid" placeholder="Username" value=<?php echo $userName; ?/>>
<input type="email" id="email" name="mail" placeholder="email" value=<?php echo $email; ?/>>
<input type="password" id="pwd" name="pwd" placeholder="password"/>
<input type="password" id="pwd-repeat" name="pwd-repeat" placeholder="repeat password"/>
<h5>Profile Picture</h5>
<div class="upload-btn-wrapper">
<button class="btn">Upload a file</button>
<input type="file" name='dp'/>
</div>
<!-- <img id="userDp" src="" >-->
<h5>Gender</h5>
<label class="container" for="gender-m">Male
<input type="radio" checked="checked" name="gender" value="m" id="gender-m"/>
<span class="checkmark"></span>
</label>
<label class="container" for="gender-f">Female
<input type="radio" name="gender" value="f" id="gender-f"/>
<span class="checkmark"></span>
</label>
<h5>Optional</h5>
<input type="text" id="f-name" name="f-name" placeholder="First Name" />
<input type="text" id="l-name" name="l-name" placeholder="Last Name" />
<input type="text" id="headline" name="headline" placeholder="Your Profile Headline"/>
<textarea id="bio" name="bio" placeholder="What you want to tell people about yourself"></textarea>
<input type="submit" class="button next" name="signup-submit" value="signup"/>
</form>
<hr />
</div>
< ?php include 'includes/footer.php'; ?>
signup.inc.php
//signup.inc.php
< ?php
if (isset($_POST['signup-submit']))
{
require 'dbh.inc.php';
$userName = $_POST['uid'];
$email = $_POST['mail'];
$password = $_POST['pwd'];
$passwordRepeat = $_POST['pwd-repeat'];
$gender = $_POST['gender'];
$headline = $_POST['headline'];
$bio = $_POST['bio'];
$f_name = $_POST['f-name'];
$l_name = $_POST['l-name'];
if (empty($userName) || empty($email) || empty($password) || empty($passwordRepeat))
{
header("Location: ../signup.php?error=emptyfields&uid=".$userName."&mail=".$email);
exit();
}
else if (!filter_var($email, FILTER_VALIDATE_EMAIL) && !preg_match("/^[a-zA-Z0-9]*$/", $userName))
{
header("Location: ../signup.php?error=invalidmailuid");
exit();
}
else if (!filter_var($email, FILTER_VALIDATE_EMAIL))
{
header("Location: ../signup.php?error=invalidmail&uid=".$userName);
exit();
}
else if (!preg_match("/^[a-zA-Z0-9]*$/", $userName))
{
header("Location: ../signup.php?error=invaliduid&mail=".$email);
exit();
}
else if ($password !== $passwordRepeat)
{
header("Location: ../signup.php?error=passwordcheck&uid=".$userName."&mail=".$email);
exit();
}
else
{
// checking if a user already exists with the given username
$sql = "select uidUsers from users where uidUsers=?;";
$stmt = mysqli_stmt_init($conn);
if (!mysqli_stmt_prepare($stmt, $sql))
{
header("Location: ../signup.php?error=sqlerror");
exit();
}
else
{
mysqli_stmt_bind_param($stmt, "s", $userName);
mysqli_stmt_execute($stmt);
mysqli_stmt_store_result($stmt);
$resultCheck = mysqli_stmt_num_rows($stmt);
if ($resultCheck > 0)
{
header("Location: ../signup.php?error=usertaken&mail=".$email);
exit();
}
else
{
$FileNameNew = 'default.png';
require 'upload.inc.php';
$sql = "insert into users(uidUsers, emailUsers, f_name, l_name, pwdUsers, gender, "
. "headline, bio, userImg) "
. "values (?,?,?,?,?,?,?,?,?)";
$stmt = mysqli_stmt_init($conn);
if (!mysqli_stmt_prepare($stmt, $sql))
{
header("Location: ../signup.php?error=sqlerror");
exit();
}
else
{
$hashedPwd = password_hash($password, PASSWORD_DEFAULT);
mysqli_stmt_bind_param($stmt, "sssssssss", $userName, $email, $f_name, $l_name,
$hashedPwd, $gender,
$headline, $bio, $FileNameNew);
mysqli_stmt_execute($stmt);
mysqli_stmt_store_result($stmt);
header("Location: ../signup.php?signup=success");
exit();
}
}
}
}
mysqli_stmt_close($stmt);
mysqli_close($conn);
}
else
{
header("Location: ../signup.php");
exit();
}
dbh.inc.php
//dbh.inc.php
< ?php
$serverName = "localhost";
$dBUsername = "root"; //Database username
$dBPassword = "root"; //Database password
$dBName = "loginsystem"; //Database servername
$conn = mysqli_connect($serverName, $dBUsername, $dBPassword, $dBName, 3306);
if (!$conn)
{
die("Connection failed: ". mysqli_connect_error());
}
header.php
//header.php
< ?php
session_start();
require 'dbh.inc.php';
$companyName = "PHP Login/Registration System";
function strip_bad_chars( $input ){
$output = preg_replace( "/[^a-zA-Z0-9_-]/", "", $input);
return $output;
}
?>
< !DOCTYPE html>
<html>
<head>
<title>< ?php echo TITLE; ?></title>
<link href="includes/styles.css" rel="stylesheet"/>
<link rel="shortcut icon" href="" />
</head>
<body id="final-example">
<!------- LOGIN / LOGOUT FORM --------->
< ?php
if(isset($_SESSION['userId']))
{
echo '<img id="status" src="">';
}
else
{
echo '<img id="status" src=""/>';
}
?>
<div id="login">
< ?php
if(isset($_SESSION['userId']))
{
echo'<div style="text-align: center;">
<img id="userDp" src=./uploads/'.$_SESSION["userImg"].'/>
<h3>' . strtoupper($_SESSION['userUid']) . '</h3>
<a href="profile.php" class="button login">Profile</a>
<a href="edit-profile.php" class="button login">Edit Profile</a>
<a href="includes/logout.inc.php" class="button login">Logout</a>
</div>';
}
else
{
if(isset($_GET['error']))
{
if($_GET['error'] == 'emptyfields')
{
echo '<p class="closed">*please fill in all the fields</p>';
}
else if($_GET['error'] == 'nouser')
{
echo '<p class="closed">*username does not exist</p>';
}
else if ($_GET['error'] == 'wrongpwd')
{
echo '<p class="closed">*wrong password</p>';
}
else if ($_GET['error'] == 'sqlerror')
{
echo '<p class="closed">*website error. contact admint to have it fixed</p>';
}
}
echo '<form method="post" action="includes/login.inc.php" id="login-form">
<input type="text" id="name" name="mailuid" placeholder="Username..."/>
<input type="password" id="password" name="pwd" placeholder="Password..."/>
<input type="submit" class="button next login" name="login-submit" value="Login"/>
</form>
<a href="signup.php" class="button previous">Signup</a>';
}
?>
<!------- LOGIN / LOGOUT FORM END --------->
<div class="wrapper">
<div class="content">
</div></div></body></html>
login.inc.php
//login.inc.php
< ?php
if (isset($_POST['login-submit']))
{
require 'dbh.inc.php';
$mailuid = $_POST['mailuid'];
$password = $_POST['pwd'];
if (empty($mailuid) || empty($password))
{
header("Location: ../index.php?error=emptyfields");
exit();
}
else
{
$sql = "SELECT * FROM users WHERE uidUsers=?;";
$stmt = mysqli_stmt_init($conn);
if (!mysqli_stmt_prepare($stmt, $sql))
{
header("Location: ../index.php?error=sqlerror");
exit();
}
else
{
mysqli_stmt_bind_param($stmt, "s", $mailuid);
mysqli_stmt_execute($stmt);
$result = mysqli_stmt_get_result($stmt);
if($row = mysqli_fetch_assoc($result))
{
$pwdCheck = password_verify($password, $row['pwdUsers']);
if ($pwdCheck == false)
{
header("Location: ../index.php?error=wrongpwd");
exit();
}
else if($pwdCheck == true)
{
session_start();
$_SESSION['userId'] = $row['idUsers'];
$_SESSION['userUid'] = $row['uidUsers'];
$_SESSION['emailUsers'] = $row['emailUsers'];
$_SESSION['f_name'] = $row['f_name'];
$_SESSION['l_name'] = $row['l_name'];
$_SESSION['gender'] = $row['gender'];
$_SESSION['headline'] = $row['headline'];
$_SESSION['bio'] = $row['bio'];
$_SESSION['userImg'] = $row['userImg'];
header("Location: ../index.php?login=success");
exit();
}
else
{
header("Location: ../index.php?error=wrongpwd");
exit();
}
}
else
{
header("Location: ../index.php?error=nouser");
exit();
}
}
}
}
else
{
header("Location: ../index.php");
exit();
}
logout.inc.php
//logout.inc.php
< ?php
session_start();
session_unset();
session_destroy();
header("Location: ../index.php");
edit-profile.php
//edit-profile.php
< ?php
define(TITLE, "Edit Profile");
include 'includes/header.php';
if (!isset($_SESSION['userId']))
{
header("Location: index.php");
exit();
}
?>
<div style="text-align: center">
<img id="userDp" src=<?php echo "./uploads/".$_SESSION['userImg']; ?/> >
<h1>< ?php echo strtoupper($_SESSION['userUid']); ?></h1>
</div>
< ?php
$userName = '';
$email = '';
if(isset($_GET['error']))
{
if($_GET['error'] == 'emptyemail')
{
echo '<p class="closed">*Profile email cannot be empty';
$email = $_GET['mail'];
}
else if ($_GET['error'] == 'invalidmail')
{
echo '<p class="closed">*Please enter a valid email</p>';
}
else if ($_GET['error'] == 'emptyoldpwd')
{
echo '<p class="closed">*You must enter the current password to change it</p>';
}
else if ($_GET['error'] == 'emptynewpwd')
{
echo '<p class="closed">*Please enter the new password</p>';
}
else if ($_GET['error'] == 'emptyreppwd')
{
echo '<p class="closed">*Please confirm new password</p>';
}
else if ($_GET['error'] == 'wrongpwd')
{
echo '<p class="closed">*Current password is wrong</p>';
}
else if ($_GET['error'] == 'samepwd')
{
echo '<p class="closed">*New password cannot be same as old password</p>';
}
else if ($_GET['error'] == 'passwordcheck')
{
echo '<p class="closed">*Confirmation password is not the same as the new password</p>';
}
}
else if (isset($_GET['edit']) == 'success')
{
echo '<p class="open">*Profile Updated Successfully</p>';
}
?>
<form action="includes/profileUpdate.inc.php" method='post' id="contact-form" enctype="multipart/form-data">
<h5>Personal Information</h5>
<label for="email">Email</label>
<input type="email" id="email" name="email" placeholder="email"
value=<?php echo $_SESSION['emailUsers']; ?/>><br />
<label>Full Name</label>
<input type="text" id="f-name" name="f-name" placeholder="First Name"
value=<?php echo $_SESSION['f_name']; ?/>>
<input type="text" id="l-name" name="l-name" placeholder="Last Name"
value=<?php echo $_SESSION['l_name']; ?/>>
<label class="container" for="gender-m">Male
<input type="radio" name="gender" value="m" id="gender-m"
<?php if ($_SESSION['gender'] == 'm'){ ?/>
checked="checked"
< ?php } ?>>
<span class="checkmark"></span>
</label>
<label class="container" for="gender-f">Female
<input type="radio" name="gender" value="f" id="gender-f"
<?php if ($_SESSION['gender'] == 'f'){ ?/>
checked="checked"
< ?php } ?>>
<span class="checkmark"></span>
</label>
<label for="headline">Profile Headline</label>
<input type="text" id="headline" name="headline" placeholder="Your Profile Headline"
value='<?php echo $_SESSION['headline']; ?/>'><br />
<label for="bio">Profile Bio</label>
<textarea id="bio" name="bio" maxlength="5000"
placeholder="What you want to tell people about yourself"
>< ?php echo $_SESSION['bio']; ?></textarea>
<h5>Change Password</h5>
<input type="password" id="old-pwd" name="old-pwd" placeholder="current password"/><br />
<input type="password" id="pwd" name="pwd" placeholder="new password"/>
<input type="password" id="pwd-repeat" name="pwd-repeat" placeholder="repeat new password"/>
<h5>Profile Picture</h5>
<div class="upload-btn-wrapper">
<button class="btn">Upload a file</button>
<input type="file" name='dp' value=<?php echo $_SESSION['userImg']; ?/>>
</div>
<input type="submit" class="button next" name="update-profile" value="Update Profile"/>
</form>
<hr />
< ?php include 'includes/footer.php'; ?>
profileUpdate.inc.php
//profileUpdate.inc.php
< ?php
session_start();
if (isset($_POST['update-profile']))
{
require 'dbh.inc.php';
$email = $_POST['email'];
$f_name = $_POST['f-name'];
$l_name = $_POST['l-name'];
$oldPassword = $_POST['old-pwd'];
$password = $_POST['pwd'];
$passwordRepeat = $_POST['pwd-repeat'];
$gender = $_POST['gender'];
$headline = $_POST['headline'];
$bio = $_POST['bio'];
if (empty($email))
{
header("Location: ../edit-profile.php?error=emptyemail");
exit();
}
else if (!filter_var($email, FILTER_VALIDATE_EMAIL))
{
header("Location: ../edit-profile.php?error=invalidmail");
exit();
}
else
{
$sql = "SELECT * FROM users WHERE uidUsers=?;";
$stmt = mysqli_stmt_init($conn);
if (!mysqli_stmt_prepare($stmt, $sql))
{
header("Location: ../edit-profile.php?error=sqlerror");
exit();
}
else
{
mysqli_stmt_bind_param($stmt, "s", $_SESSION['userUid']);
mysqli_stmt_execute($stmt);
$result = mysqli_stmt_get_result($stmt);
if($row = mysqli_fetch_assoc($result))
{
$pwdChange = false;
if( (!empty($password) || !empty($passwordRepeat)) && empty($oldPassword))
{
header("Location: ../edit-profile.php?error=emptyoldpwd");
exit();
}
if( empty($password) && empty($passwordRepeat) && !empty($oldPassword))
{
header("Location: ../edit-profile.php?error=emptynewpwd");
exit();
}
if (!empty($password) && empty($passwordRepeat) && !empty($oldPassword))
{
header("Location: ../edit-profile.php?error=emptyreppwd");
exit();
}
if (empty($password) && !empty($passwordRepeat) && !empty($oldPassword))
{
header("Location: ../edit-profile.php?error=emptynewpwd");
exit();
}
if (!empty($password) && !empty($passwordRepeat) && !empty($oldPassword))
{
$pwdCheck = password_verify($oldPassword, $row['pwdUsers']);
if ($pwdCheck == false)
{
header("Location: ../edit-profile.php?error=wrongpwd");
exit();
}
if ($oldPassword == $password)
{
header("Location: ../edit-profile.php?error=samepwd");
exit();
}
if ($password !== $passwordRepeat)
{
header("Location: ../edit-profile.php?error=passwordcheck&mail=".$email);
exit();
}
$pwdChange = true;
}
$FileNameNew = $_SESSION['userImg'];
require 'upload.inc.php';
$sql = "UPDATE users "
. "SET f_name=?, "
. "l_name=?, "
. "emailUsers=?, "
. "gender=?, "
. "headline=?, "
. "bio=?, "
. "userImg=? ";
if ($pwdChange)
{
$sql .= ", pwdUsers=? "
. "WHERE uidUsers=?;";
}
else
{
$sql .= "WHERE uidUsers=?;";
}
$stmt = mysqli_stmt_init($conn);
if (!mysqli_stmt_prepare($stmt, $sql))
{
header("Location: ../edit-profile.php?error=sqlerror");
exit();
}
else
{
if ($pwdChange)
{
$hashedPwd = password_hash($password, PASSWORD_DEFAULT);
mysqli_stmt_bind_param($stmt, "sssssssss", $f_name, $l_name, $email,
$gender, $headline, $bio,
$FileNameNew, $hashedPwd, $_SESSION['userUid']);
}
else
{
mysqli_stmt_bind_param($stmt, "ssssssss", $f_name, $l_name, $email,
$gender, $headline, $bio,
$FileNameNew, $_SESSION['userUid']);
}
mysqli_stmt_execute($stmt);
mysqli_stmt_store_result($stmt);
$_SESSION['emailUsers'] = $email;
$_SESSION['f_name'] = $f_name;
$_SESSION['l_name'] = $l_name;
$_SESSION['gender'] = $gender;
$_SESSION['headline'] = $headline;
$_SESSION['bio'] = $bio;
$_SESSION['userImg'] = $FileNameNew;
header("Location: ../edit-profile.php?edit=success");
exit();
}
}
else
{
header("Location: ../edit-profile.php?error=sqlerror");
exit();
}
}
}
mysqli_stmt_close($stmt);
mysqli_close($conn);
}
else
{
header("Location: ../edit-profile.php");
exit();
}
The source code can be downloaded from the below link.
Hello Ravi,
Thank you for your code. It is one of the best of free codes of this kind on the Internet.
Could you advise me on how user can add attachments to the sign-up form?
Hi Maxim,
Thanks for the feedback. I am glad that it is helping you.
The attachment part requires some extra coding so I am thinking of posting a new article on the same.
hi, can i add different roles for user? for example i want to add admin and normal user. do i need to link to admin page after log in? and should i create another table in database which store admin’s information?
Hi Arisa,
The role is decided at the time of registration. Either super admin decides the role or by default, everyone will have a common role, for example subscriber role. After logging in, each role will lead to a different interface (webpage).
A common database is enough.
Warning: Use of undefined constant title – assumed ‘title’ (this will throw an Error in a future version of PHP) in C:\xampp\htdocs\loginsystem\edit-profile.php on line 2
Hi what version of PHP are you using?
It does work in PHP 7.
hi, i try to delete “bio” element just to check whether it can function or not, apparently the data does not enter in database anymore once i delete any elements. can you tell me why?
hi, i try to add “address” in the signup function but it always lead me to error. can you show me how to do it? and where i am supposed to edit
Add a new placeholder in form and you need to read the same key in PHP and store it into the database. Just follow any one of the existing elements of the form, you will get it.
Hi! I am trying to modify the signup.php by adding croppie.js image cropper to it. The problem is that croppie displays the final photo as base64 and thus it cannot be uploaded to the database. Any chance of adding a base 64 decoder to this application?
Hi,
You can use the base64 decoder function before inserting the data into the database.
Refer to this: https://docs.oracle.com/javase/8/docs/api/java/util/Base64.Decoder.html
thank you for the response. However, I’m new to PHP and i don’t know how to do this the right way. Tried nearly all combinations of the decode without success :(