In this tutorial, we are going to learn how to engender a secure PHP 7 utilizer authentication and authenticate system with MySQL database utilizing procedural programming approach. In the following demo, you can check out the final output of this PHP 7 Authenticate system tutorial.
Utilizer authentication is a standard security mechanism, It sanctions identified users to access any digital application or website. It rigorously obviates unidentified users from accessing web or mobile
application.
We utilize digital products such as Facebook, Twitter, Gmail in our day to day life and we are virtually acclimated with utilizer registration and authenticate mechanism. You engender an account afore authenticate in to these applications this way you can utilize their features.
What We Will Learn:
In this article, we will highlight some of the core features that are required to build a complete login and registration system with PHP & MySQL.
- Creating Signin and Signup forms with Bootstrap 4
- Making MySQL database connection with PHP 7 project
- Managing user data in session
- PHP server-side validation
- Handling error messages
- Sending user verification email using SwiftMailer plugin
- Securing a password with the password hash mechanism
- Password verification
- URL redirection based on user’s logged-in state
- Display logged-in user’s data using PHP 7 session
- Logout and destroying the session
Prerequisite
Before you start creating a secure PHP 7 Login & User Registration system, you must set up a local web server using MAMP or XAMPP.
PHP 7 File & Folder Structure
Open MAMP or XAMPP and start your web server then and go to htdocs folder and create the following folder and files which are essential to develop our user authentication system.
\-- php-user-authentication
|-- config
|--- db.php
|-- controllers
|--- login.php
|--- register.php
|--- user_activation.php
|-- css
|--- style.css
|-- lib
|--- 3rd party plugins
|-- dashboard.php
|-- header.php
|-- index.php
|-- logout.php
|-- signup.php
|-- user_verification.phpCreate Database & Table in MySQL
Our local web server is up and running, go to <a href="//localhost:8888/phpMyAdmin" rel="noopener noreferrer" target="_blank">PHPMyAdmin</a>.</p> <p>First create database <code>`your_database_name`</code>.</p> <p>Create table <code>`table_name`</code> in the MySQL database.</p> <p>You can create columns manually or even you can execute the below sql script from <code>SQL</code> tab to create columns with following values.</p> <pre><code class="language-sql">CREATE TABLE `users` [ `id` int[11] NOT NULL, `firstname` varchar[100] NOT NULL, `lastname` varchar[100] NOT NULL, `email` varchar[50] NOT NULL, `mobilenumber` varchar[50] NOT NULL, `password` varchar[255] NOT NULL, `token` varchar[255] NOT NULL, `is_active` enum['0','1'] NOT NULL, `date_time` date NOT NULL ] ENGINE=InnoDB DEFAULT CHARSET=utf8;</code></pre> <h2>Connect Database with PHP 7</h2> <p><span id="ezoic-pub-ad-placeholder-113" class="ezoic-adpicker-ad"></span><span class="ezoic-ad ezoic-at-0 banner-1 banner-1113 adtester-container adtester-container-113" data-ez-name="laravelcode_com-banner-1"><span id="div-gpt-ad-laravelcode_com-banner-1-0" ezaw="336" ezah="280" style="position:relative;z-index:0;display:inline-block;padding:0;width:100%;max-width:1200px;margin-left:auto!important;margin-right:auto!important;min-height:280px;min-width:336px" class="ezoic-ad"><script data-ezscrex="false" data-cfasync="false" type="text/javascript" style="display:none">if[typeof ez_ad_units != 'undefined']{ez_ad_units.push[[[336,280],'laravelcode_com-banner-1','ezslot_6',113,'0','0']]};__ez_fad_position['div-gpt-ad-laravelcode_com-banner-1-0'];Add the following code in <strong>config/db.php</strong> file.</p> <pre><code class="language-php"><?php // Enable us to use Headers ob_start[]; // Set sessions if[!isset[$_SESSION]] { session_start[]; } $hostname = "localhost"; $username = "phpdemo"; $password = "4Mu99BhzK8dr4vF1"; $dbname = "positronx_db"; $connection = mysqli_connect[$hostname, $username, $password, $dbname] or die["Database connection not established."] ?></code></pre> <p>The <a href="//www.php.net/manual/en/function.ob-start.php" rel="noopener noreferrer" target="_blank">ob_start[]</a> method keeps an eye on output buffering and allow us to use Header.</p> <p><span id="ezoic-pub-ad-placeholder-114" class="ezoic-adpicker-ad"></span><span class="ezoic-ad ezoic-at-0 large-leaderboard-2 large-leaderboard-2114 adtester-container adtester-container-114" data-ez-name="laravelcode_com-large-leaderboard-2"><span id="div-gpt-ad-laravelcode_com-large-leaderboard-2-0" ezaw="300" ezah="250" style="position:relative;z-index:0;display:inline-block;padding:0;min-height:250px;min-width:300px" class="ezoic-ad"><script data-ezscrex="false" data-cfasync="false" type="text/javascript" style="display:none">if[typeof ez_ad_units != 'undefined']{ez_ad_units.push[[[300,250],'laravelcode_com-large-leaderboard-2','ezslot_5',114,'0','0']]};__ez_fad_position['div-gpt-ad-laravelcode_com-large-leaderboard-2-0'];The <strong>$_SESSION</strong> allow us to save data that we can use in our PHP application, session are alive as long as the browser window is open.</p> <h2>Design User Registration & Login Form UI with Bootstrap 4</h2> <p>To design a user registration & login form UI we are using Bootstrap 4, add the Bootstrap CSS, JavaScript and jQuery link in the head section of the HTML layout.</p> <p>Add the following code in the <strong>signup.php</strong>.</p> <pre><code class="language-html"><!doctype html> <html lang="en"> <head> <meta charset="utf-8"> <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no"> <link rel="stylesheet" href="//stackpath.bootstrapcdn.com/bootstrap/4.5.0/css/bootstrap.min.css"> <link rel="stylesheet" href="./css/style.css"> <title>PHP User Registration System Example</title> <!-- jQuery + Bootstrap JS --> <script src="//ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script> <script src="//stackpath.bootstrapcdn.com/bootstrap/4.5.0/js/bootstrap.min.js"></script> </head> <body> <div class="App"> <div class="vertical-center"> <div class="inner-block"> <form action="" method="post"> <h3>Register</h3> <div class="form-group"> <label>First name</label> <input type="text" class="form-control" name="firstname" id="firstName" /> </div> <div class="form-group"> <label>Last name</label> <input type="text" class="form-control" name="lastname" id="lastName" /> </div> <div class="form-group"> <label>Email</label> <input type="email" class="form-control" name="email" id="email" /> </div> <div class="form-group"> <label>Mobile</label> <input type="text" class="form-control" name="mobilenumber" id="mobilenumber" /> </div> <div class="form-group"> <label>Password</label> <input type="password" class="form-control" name="password" id="password" /> </div> <button type="submit" name="submit" id="submit" class="btn btn-outline-primary btn-lg btn-block"> Sign up </button> </form> </div> </div> </div> </body> </html></code></pre> <p>Add the following code in the <strong>index.php</strong> to create a login form layout.</p> <pre><code class="language-html"><!doctype html> <html lang="en"> <head> <meta charset="utf-8"> <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no"> <link rel="stylesheet" href="//stackpath.bootstrapcdn.com/bootstrap/4.5.0/css/bootstrap.min.css"> <link rel="stylesheet" href="css/style.css"> <title>PHP Login System</title> <!-- jQuery + Bootstrap JS --> <script src="//ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script> <script src="//stackpath.bootstrapcdn.com/bootstrap/4.5.0/js/bootstrap.min.js"></script> </head> <body> <!-- Login form --> <div class="App"> <div class="vertical-center"> <div class="inner-block"> <form action="" method="post"> <h3>Login</h3> <div class="form-group"> <label>Email</label> <input type="email" class="form-control" name="email_signin" id="email_signin" /> </div> <div class="form-group"> <label>Password</label> <input type="password" class="form-control" name="password_signin" id="password_signin" /> </div> <button type="submit" name="login" id="sign_in" class="btn btn-outline-primary btn-lg btn-block">Sign in</button> </form> </div> </div> </div> </body> </html></code></pre> <p>To add styling in PHP user authentication app go to <strong>css/style.css</strong> and add the following code.</p> <pre><code class="language-css">* { box-sizing: border-box; } body { font-weight: 400; background-color: #EEEFF4; } body, html, .App, .vertical-center { width: 100%; height: 100%; } .navbar { background: #1833FF!important; width: 100%; } .btn-outline-primary { border-color: #1833FF; color: #1833FF; } .btn-outline-primary:hover { background-color: #1833FF; color: #ffffff; } .vertical-center { display: flex; text-align: left; justify-content: center; flex-direction: column; } .inner-block { width: 450px; margin: auto; background: #ffffff; box-shadow: 0px 14px 80px rgba[34, 35, 58, 0.2]; padding: 40px 55px 45px 55px; transition: all .3s; border-radius: 20px; } .vertical-center .form-control:focus { border-color: #2554FF; box-shadow: none; } .vertical-center h3 { text-align: center; margin: 0; line-height: 1; padding-bottom: 20px; } label { font-weight: 500; }</code></pre> <h2>Build User Registration System</h2> <p>To create a secure user registration system, we need to get inside the <strong>controllers/register.php</strong> file and place the following code inside of it.</p> <pre><code class="language-php"><?php // Database connection include['config/db.php']; // Swiftmailer lib require_once './lib/vendor/autoload.php'; // Error & success messages global $success_msg, $email_exist, $f_NameErr, $l_NameErr, $_emailErr, $_mobileErr, $_passwordErr; global $fNameEmptyErr, $lNameEmptyErr, $emailEmptyErr, $mobileEmptyErr, $passwordEmptyErr, $email_verify_err, $email_verify_success; // Set empty form vars for validation mapping $_first_name = $_last_name = $_email = $_mobile_number = $_password = ""; if[isset[$_POST["submit"]]] { $firstname = $_POST["firstname"]; $lastname = $_POST["lastname"]; $email = $_POST["email"]; $mobilenumber = $_POST["mobilenumber"]; $password = $_POST["password"]; // check if email already exist $email_check_query = mysqli_query[$connection, "SELECT * FROM users WHERE email = '{$email}' "]; $rowCount = mysqli_num_rows[$email_check_query]; // PHP validation // Verify if form values are not empty if[!empty[$firstname] && !empty[$lastname] && !empty[$email] && !empty[$mobilenumber] && !empty[$password]]{ // check if user email already exist if[$rowCount > 0] { $email_exist = ' <div class="alert alert-danger" role="alert"> User with email already exist! </div> '; } else { // clean the form data before sending to database $_first_name = mysqli_real_escape_string[$connection, $firstname]; $_last_name = mysqli_real_escape_string[$connection, $lastname]; $_email = mysqli_real_escape_string[$connection, $email]; $_mobile_number = mysqli_real_escape_string[$connection, $mobilenumber]; $_password = mysqli_real_escape_string[$connection, $password]; // perform validation if[!preg_match["/^[a-zA-Z ]*$/", $_first_name]] { $f_NameErr = '<div class="alert alert-danger"> Only letters and white space allowed. </div>'; } if[!preg_match["/^[a-zA-Z ]*$/", $_last_name]] { $l_NameErr = '<div class="alert alert-danger"> Only letters and white space allowed. </div>'; } if[!filter_var[$_email, FILTER_VALIDATE_EMAIL]] { $_emailErr = '<div class="alert alert-danger"> Email format is invalid. </div>'; } if[!preg_match["/^[0-9]{10}+$/", $_mobile_number]] { $_mobileErr = '<div class="alert alert-danger"> Only 10-digit mobile numbers allowed. </div>'; } if[!preg_match["/^[?=.*\d][?=.*[@#\-_$%^&+=§!\?]][?=.*[a-z]][?=.*[A-Z]][<a target="_blank" href="//laravelcode.com/cdn-cgi/l/email-protection" class="__cf_email__" data-cfemail="f5c5d8ccb4d8af94d88fb5">[email protected]</a>#\-_$%^&+=§!\?]{6,20}$/", $_password]] { $_passwordErr = '<div class="alert alert-danger"> Password should be between 6 to 20 charcters long, contains atleast one special chacter, lowercase, uppercase and a digit. </div>'; } // Store the data in db, if all the preg_match condition met if[[preg_match["/^[a-zA-Z ]*$/", $_first_name]] && [preg_match["/^[a-zA-Z ]*$/", $_last_name]] && [filter_var[$_email, FILTER_VALIDATE_EMAIL]] && [preg_match["/^[0-9]{10}+$/", $_mobile_number]] && [preg_match["/^[?=.*\d][?=.*[@#\-_$%^&+=§!\?]][?=.*[a-z]][?=.*[A-Z]][<a target="_blank" href="//laravelcode.com/cdn-cgi/l/email-protection" class="__cf_email__" data-cfemail="e4d4c9dda5c9be85c99ea4">[email protected]</a>#\-_$%^&+=§!\?]{8,20}$/", $_password]]]{ // Generate random activation token $token = md5[rand[].time[]]; // Password hash $password_hash = password_hash[$password, PASSWORD_BCRYPT]; // Query $sql = "INSERT INTO users [firstname, lastname, email, mobilenumber, password, token, is_active, date_time] VALUES ['{$firstname}', '{$lastname}', '{$email}', '{$mobilenumber}', '{$password_hash}', '{$token}', '0', now[]]"; // Create mysql query $sqlQuery = mysqli_query[$connection, $sql]; if[!$sqlQuery]{ die["MySQL query failed!" . mysqli_error[$connection]]; } // Send verification email if[$sqlQuery] { $msg = 'Click on the activation link to verify your email. <br><br> <a href="//localhost:8888/php-user-authentication/user_verificaiton.php?token='.$token.'"> Click here to verify email</a> '; // Create the Transport $transport = [new Swift_SmtpTransport['smtp.gmail.com', 465, 'ssl']] ->setUsername['<a target="_blank" href="//laravelcode.com/cdn-cgi/l/email-protection" class="__cf_email__" data-cfemail="eb92849e99b48e868a8287ab8c868a8287c5888486">[email protected]</a>'] ->setPassword['your_email_password']; // Create the Mailer using your created Transport $mailer = new Swift_Mailer[$transport]; // Create a message $message = [new Swift_Message['Please Verify Email Address!']] ->setFrom[[$email => $firstname . ' ' . $lastname]] ->setTo[$email] ->addPart[$msg, "text/html"] ->setBody['Hello! User']; // Send the message $result = $mailer->send[$message]; if[!$result]{ $email_verify_err = '<div class="alert alert-danger"> Verification email coud not be sent! </div>'; } else { $email_verify_success = '<div class="alert alert-success"> Verification email has been sent! </div>'; } } } } } else { if[empty[$firstname]]{ $fNameEmptyErr = '<div class="alert alert-danger"> First name can not be blank. </div>'; } if[empty[$lastname]]{ $lNameEmptyErr = '<div class="alert alert-danger"> Last name can not be blank. </div>'; } if[empty[$email]]{ $emailEmptyErr = '<div class="alert alert-danger"> Email can not be blank. </div>'; } if[empty[$mobilenumber]]{ $mobileEmptyErr = '<div class="alert alert-danger"> Mobile number can not be blank. </div>'; } if[empty[$password]]{ $passwordEmptyErr = '<div class="alert alert-danger"> Password can not be blank. </div>'; } } } ?></code></pre> <p>Include the database to handle the user data. The <strong>isset[]</strong> method is checking the form data when a user clicks on the submit button the same name attribute we passed in the signup form.</p> <p>Extract the user data such as <strong>firstname, lastname, email, mobilenumber</strong> and <strong>password</strong> using the HTTP <strong>$_POST[”]</strong> method.</p> <p><span id="ezoic-pub-ad-placeholder-119" class="ezoic-adpicker-ad"></span><span class="ezoic-ad ezoic-at-0 large-mobile-banner-2 large-mobile-banner-2119 adtester-container adtester-container-119" data-ez-name="laravelcode_com-large-mobile-banner-2"><span id="div-gpt-ad-laravelcode_com-large-mobile-banner-2-0" ezaw="728" ezah="90" style="position:relative;z-index:0;display:inline-block;padding:0;width:100%;max-width:1200px;margin-left:auto!important;margin-right:auto!important;min-height:90px;min-width:728px" class="ezoic-ad"><script data-cfasync="false">if[typeof ez_ad_units != 'undefined']{ez_ad_units.push[[[728,90],'laravelcode_com-large-mobile-banner-2','ezslot_13',119,'0','0']]};__ez_fad_position['div-gpt-ad-laravelcode_com-large-mobile-banner-2-0'];Validate if the email provided by the user already exists in the database using the SQL script via <strong>mysqli_query[]</strong> method.</p> <p>Check if the form values are not empty.</p> <p>Verify if user email already exists, then display the error using the Bootstrap alert message component. We make the error message a global variable so that we can show it to the user.</p> <p>The <strong>mysqli_real_escape_string[]</strong> method cleans the data before sending to the database.</p> <p>The <strong>preg_match[]</strong> method does the PHP validation for the name, mobile name and password. For validating email value, we used the <strong>filter_var[]</strong> method. We wrapped the errors and set it to global as well.</p> <p>We need to generate the random token using the <strong>md5[rand[].time[]]</strong> method to send verification email to the user email id.</p> <p>To securely hash the password, we used the <a href="//www.php.net/manual/en/function.password-hash.php" rel="noopener noreferrer" target="_blank">password_hash[]</a> method. The password_hash[] creates a new password hash using a secure one-way hashing algorithm.</p> <p>We need to install the SwiftMailer php plugin to send the verification mail to the user, i used the following composer command to install the SwiftMailer library. Make sure you have composer installed on your development machine.</p> <pre><code class="language-php">composer require "swiftmailer/swiftmailer:^6.0"</code></pre> <p>We need to import the <a href="//swiftmailer.symfony.com/" rel="noopener noreferrer" target="_blank">SwiftMailer</a> library and add the SwiftMailer script also define the email template that will be sent to the user.</p> <p>Now, we need to implement the user authentication logic inside the <strong>signup.php</strong> file.</p> <pre><code class="language-html"><?php include['./controllers/register.php']; ?> <!doctype html> <html lang="en"> <head> <meta charset="utf-8"> <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no"> <link rel="stylesheet" href="//stackpath.bootstrapcdn.com/bootstrap/4.5.0/css/bootstrap.min.css"> <link rel="stylesheet" href="./css/style.css"> <title>PHP User Registration System Example</title> <!-- jQuery + Bootstrap JS --> <script src="//ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script> <script src="//stackpath.bootstrapcdn.com/bootstrap/4.5.0/js/bootstrap.min.js"></script> </head> <body> <?php include['./header.php']; ?> <div class="App"> <div class="vertical-center"> <div class="inner-block"> <form action="" method="post"> <h3>Register</h3> <?php echo $success_msg; ?> <?php echo $email_exist; ?> <?php echo $email_verify_err; ?> <?php echo $email_verify_success; ?> <div class="form-group"> <label>First name</label> <input type="text" class="form-control" name="firstname" id="firstName" /> <?php echo $fNameEmptyErr; ?> <?php echo $f_NameErr; ?> </div> <div class="form-group"> <label>Last name</label> <input type="text" class="form-control" name="lastname" id="lastName" /> <?php echo $l_NameErr; ?> <?php echo $lNameEmptyErr; ?> </div> <div class="form-group"> <label>Email</label> <input type="email" class="form-control" name="email" id="email" /> <?php echo $_emailErr; ?> <?php echo $emailEmptyErr; ?> </div> <div class="form-group"> <label>Mobile</label> <input type="text" class="form-control" name="mobilenumber" id="mobilenumber" /> <?php echo $_mobileErr; ?> <?php echo $mobileEmptyErr; ?> </div> <div class="form-group"> <label>Password</label> <input type="password" class="form-control" name="password" id="password" /> <?php echo $_passwordErr; ?> <?php echo $passwordEmptyErr; ?> </div> <button type="submit" name="submit" id="submit" class="btn btn-outline-primary btn-lg btn-block">Sign up </button> </form> </div> </div> </div> </body> </html></code></pre> <h2>User Email Verification Script in PHP 7</h2> <p>We have defined the SwiftMailer configurations in the <strong>register.php</strong> file, now implement the user verification script to send verification email.</p> <p>Add the following code in <strong>controllers/user_activation.php</strong> file.</p> <pre><code class="language-php"><?php // Database connection include['./config/db.php']; global $email_verified, $email_already_verified, $activation_error; // GET the token = ?token if[!empty[$_GET['token']]]{ $token = $_GET['token']; } else { $token = ""; } if[$token != ""] { $sqlQuery = mysqli_query[$connection, "SELECT * FROM users WHERE token = '$token' "]; $countRow = mysqli_num_rows[$sqlQuery]; if[$countRow == 1]{ while[$rowData = mysqli_fetch_array[$sqlQuery]]{ $is_active = $rowData['is_active']; if[$is_active == 0] { $update = mysqli_query[$connection, "UPDATE users SET is_active = '1' WHERE token = '$token' "]; if[$update]{ $email_verified = '<div class="alert alert-success"> User email successfully verified! </div> '; } } else { $email_already_verified = '<div class="alert alert-danger"> User email already verified! </div> '; } } } else { $activation_error = '<div class="alert alert-danger"> Activation error! </div> '; } } ?></code></pre> <p>Add the following code in <strong>user_verification.php</strong> file.</p> <pre><code class="language-html"><?php include['./controllers/user_activation.php']; ?> <!doctype html> <html lang="en"> <head> <meta charset="utf-8"> <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no"> <link rel="stylesheet" href="//stackpath.bootstrapcdn.com/bootstrap/4.5.0/css/bootstrap.min.css"> <link rel="stylesheet" href="./css/style.css"> <title>User Verification</title> <!-- jQuery + Bootstrap JS --> <script src="//ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script> <script src="//stackpath.bootstrapcdn.com/bootstrap/4.5.0/js/bootstrap.min.js"></script> </head> <body> <div class="container"> <div class="jumbotron text-center"> <h2 class="display-4">User Email Verification Demo</h2> <div class="col-12 mb-5 text-center"> <?php echo $email_already_verified; ?> <?php echo $email_verified; ?> <?php echo $activation_error; ?> </div> <p class="lead">If user account is verified then click on the following button to login.</p> <a class="btn btn-lg btn-success" href="//localhost:8888/php-user-authentication/index.php" >Click to Login </a> </div> </div> </body> </html></code></pre> <h2>Build PHP 7 Login System with MySQL</h2> <p>The following code allows access to only those users who have verified their email address. A non-verified user can not access in the app, and We are also storing the logged-in user’s data into the PHP Session and with the help of <strong>header[“Location: page_url.php”]</strong> method redirecting the logged-in user to dashboard.php page.</p> <p>To create PHP 7 Login system with MySQL, Add the following code in <strong>controllers/login.php</strong> file.</p> <pre><code class="language-php"><?php // Database connection include['config/db.php']; global $wrongPwdErr, $accountNotExistErr, $emailPwdErr, $verificationRequiredErr, $email_empty_err, $pass_empty_err; if[isset[$_POST['login']]] { $email_signin = $_POST['email_signin']; $password_signin = $_POST['password_signin']; // clean data $user_email = filter_var[$email_signin, FILTER_SANITIZE_EMAIL]; $pswd = mysqli_real_escape_string[$connection, $password_signin]; // Query if email exists in db $sql = "SELECT * From users WHERE email = '{$email_signin}' "; $query = mysqli_query[$connection, $sql]; $rowCount = mysqli_num_rows[$query]; // If query fails, show the reason if[!$query]{ die["SQL query failed: " . mysqli_error[$connection]]; } if[!empty[$email_signin] && !empty[$password_signin]]{ if[!preg_match["/^[?=.*\d][?=.*[@#\-_$%^&+=§!\?]][?=.*[a-z]][?=.*[A-Z]][<a target="_blank" href="//laravelcode.com/cdn-cgi/l/email-protection" class="__cf_email__" data-cfemail="61514c58204c3b004c1b21">[email protected]</a>#\-_$%^&+=§!\?]{6,20}$/", $pswd]] { $wrongPwdErr = '<div class="alert alert-danger"> Password should be between 6 to 20 charcters long, contains atleast one special chacter, lowercase, uppercase and a digit. </div>'; } // Check if email exist if[$rowCount <= 0] { $accountNotExistErr = '<div class="alert alert-danger"> User account does not exist. </div>'; } else { // Fetch user data and store in php session while[$row = mysqli_fetch_array[$query]] { $id = $row['id']; $firstname = $row['firstname']; $lastname = $row['lastname']; $email = $row['email']; $mobilenumber = $row['mobilenumber']; $pass_word = $row['password']; $token = $row['token']; $is_active = $row['is_active']; } // Verify password $password = password_verify[$password_signin, $pass_word]; // Allow only verified user if[$is_active == '1'] { if[$email_signin == $email && $password_signin == $password] { header["Location: ./dashboard.php"]; $_SESSION['id'] = $id; $_SESSION['firstname'] = $firstname; $_SESSION['lastname'] = $lastname; $_SESSION['email'] = $email; $_SESSION['mobilenumber'] = $mobilenumber; $_SESSION['token'] = $token; } else { $emailPwdErr = '<div class="alert alert-danger"> Either email or password is incorrect. </div>'; } } else { $verificationRequiredErr = '<div class="alert alert-danger"> Account verification is required for login. </div>'; } } } else { if[empty[$email_signin]]{ $email_empty_err = "<div class='alert alert-danger email_alert'> Email not provided. </div>"; } if[empty[$password_signin]]{ $pass_empty_err = "<div class='alert alert-danger email_alert'> Password not provided. </div>"; } } } ?></code></pre> <p>To implement the sign-in logic in the login page, Add the following code in <strong>controllers/index.php</strong> file.</p> <pre><code class="language-html"><!doctype html> <html lang="en"> <head> <meta charset="utf-8"> <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no"> <link rel="stylesheet" href="//stackpath.bootstrapcdn.com/bootstrap/4.5.0/css/bootstrap.min.css"> <link rel="stylesheet" href="css/style.css"> <title>PHP User Registration & Login System Demo</title> <!-- jQuery + Bootstrap JS --> <script src="//ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script> <script src="//stackpath.bootstrapcdn.com/bootstrap/4.5.0/js/bootstrap.min.js"></script> </head> <body> <!-- Header --> <?php include['../php-user-authentication/header.php']; ?> <!-- Login script --> <?php include['./controllers/login.php']; ?> <!-- Login form --> <div class="App"> <div class="vertical-center"> <div class="inner-block"> <form action="" method="post"> <h3>Login</h3> <?php echo $accountNotExistErr; ?> <?php echo $emailPwdErr; ?> <?php echo $verificationRequiredErr; ?> <?php echo $email_empty_err; ?> <?php echo $pass_empty_err; ?> <div class="form-group"> <label>Email</label> <input type="email" class="form-control" name="email_signin" id="email_signin" /> </div> <div class="form-group"> <label>Password</label> <input type="password" class="form-control" name="password_signin" id="password_signin" /> </div> <button type="submit" name="login" id="sign_in" class="btn btn-outline-primary btn-lg btn-block">Sign in</button> </form> </div> </div> </div> </body> </html></code></pre> <h2>Display Logged-in User’s Data & Log Out Script</h2> <p>Add the following code in <strong>dashboard.php</strong> to display the user data to the logged-in users only.</p> <pre><code class="language-html"><?php include['config/db.php']; ?> <!doctype html> <html lang="en"> <head> <meta charset="utf-8"> <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no"> <link rel="stylesheet" href="//stackpath.bootstrapcdn.com/bootstrap/4.5.0/css/bootstrap.min.css"> <link rel="stylesheet" href="./css/style.css"> <title>PHP User Registration System Example</title> <!-- jQuery + Bootstrap JS --> <script src="//ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script> <script src="//stackpath.bootstrapcdn.com/bootstrap/4.5.0/js/bootstrap.min.js"></script> </head> <body> <div class="container mt-5"> <div class="d-flex justify-content-center"> <div class="card" style="width: 25rem"> <div class="card-body"> <h5 class="card-title text-center mb-4">User Profile</h5> <h6 class="card-subtitle mb-2 text-muted"><?php echo $_SESSION['firstname']; ?> <?php echo $_SESSION['lastname']; ?></h6> <p class="card-text">Email address: <?php echo $_SESSION['email']; ?></p> <p class="card-text">Mobile number: <?php echo $_SESSION['mobilenumber']; ?></p> <a class="btn btn-danger btn-block" href="logout.php">Log out</a> </div> </div> </div> </div> </body> </html></code></pre> <p>Now, we need to destroy the session to Sign-out the user from the user auth system. We have already passed the logout.php link to the logout button in dashboard file.</p> <p>Open <strong>logout.php</strong> and place the following code in it.</p> <pre><code class="language-php"><?php session_start[]; session_destroy[]; header["Location: //localhost:8888/php-user-authentication/index.php"] ;?></code></pre> <h2>Conclusion</h2> <p>So, this was the PHP 7 User authentication & Login App. I hope you have got the basic idea of how can we make a login and auth sytem with PHP and MySQL. We covered some of the essential topics such as sending a verification email to user, securely hash the password.</p> <span id="ezoic-pub-ad-placeholder-109"></span><span class="ezoic-ad ezoic-at-0 large-mobile-banner-1 large-mobile-banner-1109 adtester-container adtester-container-109" data-ez-name="laravelcode_com-large-mobile-banner-1"><span id="div-gpt-ad-laravelcode_com-large-mobile-banner-1-0" ezaw="580" ezah="400" style="position:relative;z-index:0;display:inline-block;padding:0;width:100%;max-width:1200px;margin-left:auto!important;margin-right:auto!important;min-height:400px;min-width:580px" class="ezoic-ad"><script data-cfasync="false">if[typeof ez_ad_units != 'undefined']{ez_ad_units.push[[[580,400],'laravelcode_com-large-mobile-banner-1','ezslot_4',109,'0','0']]};__ez_fad_position['div-gpt-ad-laravelcode_com-large-mobile-banner-1-0'];
Author : Harsukh Makwana