Login And Register Using PDO In PHP


Getting Started

I’ve used Bootstrap 4 and Font Awesome 5 in this tutorial and are included in the downloadables, but if you want, you can download them yourself using the links below.

For Bootstrap

For Font-awesome

Creating a Database

Next, we create the database that we are going to filter in this tutorial.

I’ve included a SQL file in the downloadable of this tutorial. All you have to do is import the said file.

You should be able to create a database named dbase.

Creating a Connection

Next, we create our connection to our database using the PDO extension.

Please create a new file, name it as conn.php and paste the codes below.

<?php
 
$host="localhost";
$db   = 'dbase';
$user="root";
$pass="";
$charset="utf8mb4";
 
$dsn = "mysql:host=$host;dbname=$db;charset=$charset";
$options = [
    PDO::ATTR_ERRMODE            => PDO::ERRMODE_EXCEPTION,
    PDO::ATTR_DEFAULT_FETCH_MODE => PDO::FETCH_ASSOC,
    PDO::ATTR_EMULATE_PREPARES   => false,
];
$pdo = new PDO($dsn, $user, $pass, $options);
 
?>

Creating a Login Form

Next, we are going to create our login form.

Please create a new file, name it as index.php and paste the codes below.

<?php session_start(); ?>
<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <title>Login and Register using PDO in PHP</title>
    <link rel="stylesheet" type="text/css" href="https://www.campcodes.com/tutorials/php-tutorials/login-and-register-using-pdo-in-php/bootstrap4/css/bootstrap.min.css">
    <script src="font-awesome/fontawesome-all.min.js"></script>
</head>
<body>
<div class="container">
    <h1 class="text-center" style="margin-top:30px;">Login and Register using PDO</h1>
    <hr>
    <div class="row justify-content-md-center">
        <div class="col-md-5">
            <?php
                if(isset($_SESSION['error'])){
                    echo "
                        <div class="alert alert-danger text-center">
                            <i class="fas fa-exclamation-triangle"></i> ".$_SESSION['error']."
                        </div>
                    ";
 
                    //unset error
                    unset($_SESSION['error']);
                }
 
                if(isset($_SESSION['success'])){
                    echo "
                        <div class="alert alert-success text-center">
                            <i class="fas fa-check-circle"></i> ".$_SESSION['success']."
                        </div>
                    ";
 
                    //unset success
                    unset($_SESSION['success']);
                }
            ?>
            <div class="card">
                <div class="card-body">
                    <h5 class="card-title text-center">Sign in your account</h5>
                    <hr>
                    <form method="POST" action="login.php">
                    	<div class="form-group row">
                          	<label for="email" class="col-3 col-form-label">Email</label>
                          	<div class="col-9">
                            	<input class="form-control" type="email" id="email" name="email" value="<?php echo (isset($_SESSION['email'])) ? $_SESSION['email'] : ''; unset($_SESSION['email']) ?>" placeholder="input email" required>
                          	</div>
                        </div>
                        <div class="form-group row">
                          	<label for="password" class="col-3 col-form-label">Password</label>
                          	<div class="col-9">
                            	<input class="form-control" type="password" id="password" name="password" value="<?php echo (isset($_SESSION['password'])) ? $_SESSION['password'] : ''; unset($_SESSION['password']) ?>" placeholder="input password" required>
                          	</div>
                        </div>
                    <hr>
                    <div>
                    	<button type="submit" class="btn btn-primary" name="login"><i class="fas fa-sign-in-alt"></i> Login</button>
                    	<a href="register_form.php">Register a new account</a>
                    </div>
                    </form>
                </div>
            </div>
        </div>
    </div>
</body>
</html>

Creating a Login Script

Next, we create a script that verifies our users.

Create a new file, name it as index.php and paste the codes below.

<?php
    //start PHP session
    session_start();
 
    //check if login form is submitted
    if(isset($_POST['login'])){
        //assign variables to post values
        $email = $_POST['email'];
        $password = $_POST['password'];
 
        //include our database connection
        include 'conn.php';
 
        //get the user with email
        $stmt = $pdo->prepare('SELECT * FROM users WHERE email = :email');
 
        try{
            $stmt->execute(['email' => $email]);
 
            //check if email exist
            if($stmt->rowCount() > 0){
                //get the row
                $user = $stmt->fetch();
 
                //validate inputted password with $user password
                if(password_verify($password, $user['password'])){
                    //action after a successful login
                    //for now just message a successful login
                    $_SESSION['success'] = 'User verification successful';
                }
                else{
                    //return the values to the user
                    $_SESSION['email'] = $email;
                    $_SESSION['password'] = $password;
 
                    $_SESSION['error'] = 'Incorrect password';
                }
 
            }
            else{
                //return the values to the user
                $_SESSION['email'] = $email;
                $_SESSION['password'] = $password;
 
                $_SESSION['error'] = 'No account associated with the email';
            }
 
        }
        catch(PDOException $e){
            $_SESSION['error'] = $e->getMessage();
        }
 
    }
    else{
        $_SESSION['error'] = 'Fill up login form first';
    }
 
    header('location: index.php');
?>

Creating a Register Form

Next, we create a registration form so that a new user can be added to our lists of users.

Please create a new file, name it as register_form.php and paste the codes below.

<?php session_start(); ?>
<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <title>Login and Register using PDO in PHP</title>
    <link rel="stylesheet" type="text/css" href="https://www.campcodes.com/tutorials/php-tutorials/login-and-register-using-pdo-in-php/bootstrap4/css/bootstrap.min.css">
    <script src="font-awesome/fontawesome-all.min.js"></script>
</head>
<body>
<div class="container">
    <h1 class="text-center" style="margin-top:30px;">Login and Register using PDO</h1>
    <hr>
    <div class="row justify-content-md-center">
        <div class="col-md-5">
            <?php
                if(isset($_SESSION['error'])){
                    echo "
                        <div class="alert alert-danger text-center">
                            <i class="fas fa-exclamation-triangle"></i> ".$_SESSION['error']."
                        </div>
                    ";
 
                    //unset error
                    unset($_SESSION['error']);
                }
 
                if(isset($_SESSION['success'])){
                    echo "
                        <div class="alert alert-success text-center">
                            <i class="fas fa-check-circle"></i> ".$_SESSION['success']."
                        </div>
                    ";
 
                    //unset success
                    unset($_SESSION['success']);
                }
            ?>
            <div class="card">
                <div class="card-body">
                    <h5 class="card-title text-center">Register a new account</h5>
                    <hr>
                    <form method="POST" action="register.php">
                    	<div class="form-group row">
                          	<label for="email" class="col-3 col-form-label">Email</label>
                          	<div class="col-9">
                            	<input class="form-control" type="email" id="email" name="email" value="<?php echo (isset($_SESSION['email'])) ? $_SESSION['email'] : ''; unset($_SESSION['email']) ?>" placeholder="input email" required>
                          	</div>
                        </div>
                        <div class="form-group row">
                          	<label for="password" class="col-3 col-form-label">Password</label>
                          	<div class="col-9">
                            	<input class="form-control" type="password" id="password" name="password" value="<?php echo (isset($_SESSION['password'])) ? $_SESSION['password'] : ''; unset($_SESSION['password']) ?>" placeholder="input password" required>
                          	</div>
                        </div>
                        <div class="form-group row">
                          	<label for="confirm" class="col-3 col-form-label">Confirm</label>
                          	<div class="col-9">
                            	<input class="form-control" type="password" id="confirm" name="confirm" value="<?php echo (isset($_SESSION['confirm'])) ? $_SESSION['confirm'] : ''; unset($_SESSION['confirm']) ?>" placeholder="re-type password">
                          	</div>
                        </div>
                    <hr>
                    <div>
                    	<button type="submit" class="btn btn-success" name="register"><i class="far fa-user"></i> Signup</button>
                    	<a href="https://www.campcodes.com/tutorials/php-tutorials/login-and-register-using-pdo-in-php/index.php">Back to login</a>
                    </div>
                    </form>
                </div>
            </div>
        </div>
    </div>
</body>
</html>

Creating a Register Script

Lastly, we create a script that registers our user.

Please create a new file, name it as register.php and paste the codes below.

<?php
    //start PHP session
    session_start();
 
    //check if register form is submitted
    if(isset($_POST['register'])){
        //assign variables to post values
        $email = $_POST['email'];
        $password = $_POST['password'];
        $confirm = $_POST['confirm'];
 
        //check if password matches confirm password
        if($password != $confirm){
            //return the values to the user
            $_SESSION['email'] = $email;
            $_SESSION['password'] = $password;
            $_SESSION['confirm'] = $confirm;
 
            //display error
            $_SESSION['error'] = 'Passwords did not match';
        }
        else{
            //include our database connection
            include 'conn.php';
 
            //check if the email is already taken
            $stmt = $pdo->prepare('SELECT * FROM users WHERE email = :email');
            $stmt->execute(['email' => $email]);
 
            if($stmt->rowCount() > 0){
                //return the values to the user
                $_SESSION['email'] = $email;
                $_SESSION['password'] = $password;
                $_SESSION['confirm'] = $confirm;
 
                //display error
                $_SESSION['error'] = 'Email already taken';
            }
            else{
                //encrypt password using password_hash()
                $password = password_hash($password, PASSWORD_DEFAULT);
 
                //insert new user to our database
                $stmt = $pdo->prepare('INSERT INTO users (email, password) VALUES (:email, :password)');
 
                try{
                    $stmt->execute(['email' => $email, 'password' => $password]);
 
                    $_SESSION['success'] = 'User verified. You can <a href="https://www.campcodes.com/tutorials/php-tutorials/login-and-register-using-pdo-in-php/index.php">login</a> now';
                }
                catch(PDOException $e){
                    $_SESSION['error'] = $e->getMessage();
                }
 
            }
 
        }
 
    }
    else{
        $_SESSION['error'] = 'Fill up registration form first';
    }
 
    header('location: register_form.php');
?>

That ends this tutorial. Happy Coding!

Download Here



Sharing is caring!

Facebook Comments

Leave a Reply