PHP Login using OOP Approach

Submitted by: 
Language: 
Visitors have accessed this post 3373 times.

Getting Started

I've used CDN for Bootstrap in this tutorial so you need internet connection for it to work.

Creating our Database

First, we are going to create our MySQL database and insert sample data as a sample user credential.

1. Open phpMyAdmin.
2. Click databases, create a database and name it as test.
3. After creating a database, click the SQL and paste the below codes. See image below for detailed instruction.

  1. CREATE TABLE `users` (
  2. `id` int(11) NOT NULL,
  3. `username` varchar(30) NOT NULL AUTO_INCREMENT,
  4. `password` varchar(30) NOT NULL,
  5. `fname` varchar(100) NOT NULL,
  1. INSERT INTO `users` (`id`, `username`, `password`, `fname`) VALUES
  2. (1, 'neovic', 'devierte', 'Neovic Devierte'),
  3. (2, 'gemalyn', 'cepe', 'Gemalyn Cepe');

database mysql

You can then use the ff credentials to login.

Username: neovic
Password: devierte

Username: gemalyn
Password: cepe

Creating our Connection

Next, we create our connection to our database by using OOP approach wherein we're gonna create a class for our connection. We're gonna name this file as DbConnection.php.

  1. <?php
  2. class DbConnection{
  3.  
  4. private $host = 'localhost';
  5. private $username = 'root';
  6. private $password = '';
  7. private $database = 'test';
  8.  
  9. protected $connection;
  10.  
  11. public function __construct(){
  12.  
  13. if (!isset($this->connection)) {
  14.  
  15. $this->connection = new mysqli($this->host, $this->username, $this->password, $this->database);
  16.  
  17. if (!$this->connection) {
  18. echo 'Cannot connect to database server';
  19. }
  20. }
  21.  
  22. return $this->connection;
  23. }
  24. }
  25. ?>

Creating User Actions

Next, we're going to create a class that involves our users table. We name this as User.php.

  1. <?php
  2. include_once('DbConnection.php');
  3.  
  4. class User extends DbConnection{
  5.  
  6. public function __construct(){
  7.  
  8. parent::__construct();
  9. }
  10.  
  11. public function check_login($username, $password){
  12.  
  13. $sql = "SELECT * FROM users WHERE username = '$username' AND password = '$password'";
  14. $query = $this->connection->query($sql);
  15.  
  16. if($query->num_rows > 0){
  17. $row = $query->fetch_array();
  18. return $row['id'];
  19. }
  20. else{
  21. return false;
  22. }
  23. }
  24.  
  25. public function details($sql){
  26.  
  27. $query = $this->connection->query($sql);
  28.  
  29. $row = $query->fetch_array();
  30.  
  31. return $row;
  32. }
  33.  
  34. public function escape_string($value){
  35.  
  36. return $this->connection->real_escape_string($value);
  37. }
  38. }

index.php

This is our index that contains our login form.

  1. <?php
  2. //start session
  3.  
  4. //redirect if logged in
  5. if(isset($_SESSION['user'])){
  6. header('location:home.php');
  7. }
  8. ?>
  9. <!DOCTYPE html>
  10. <html>
  11. <head>
  12. <title>PHP Login using OOP Approach</title>
  13. <link href="<a href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css"" rel="nofollow">https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css"</a> rel="stylesheet">
  14. </head>
  15. <body>
  16. <div class="container">
  17. <h1 class="page-header text-center">PHP Login using OOP Approach</h1>
  18. <div class="row">
  19. <div class="col-md-4 col-md-offset-4">
  20. <div class="login-panel panel panel-primary">
  21. <div class="panel-heading">
  22. <h3 class="panel-title"><span class="glyphicon glyphicon-lock"></span> Login
  23. </h3>
  24. </div>
  25. <div class="panel-body">
  26. <form method="POST" action="login.php">
  27. <fieldset>
  28. <div class="form-group">
  29. <input class="form-control" placeholder="Username" type="text" name="username" autofocus required>
  30. </div>
  31. <div class="form-group">
  32. <input class="form-control" placeholder="Password" type="password" name="password" required>
  33. </div>
  34. <button type="submit" name="login" class="btn btn-lg btn-primary btn-block"><span class="glyphicon glyphicon-log-in"></span> Login</button>
  35. </fieldset>
  36. </form>
  37. </div>
  38. </div>
  39. <?php
  40. if(isset($_SESSION['message'])){
  41. ?>
  42. <div class="alert alert-info text-center">
  43. <?php echo $_SESSION['message']; ?>
  44. </div>
  45. <?php
  46.  
  47. unset($_SESSION['message']);
  48. }
  49. ?>
  50. </div>
  51. </div>
  52. </div>
  53. </body>
  54. </html>

login.php

This is our PHP code that validates user credentials.

  1. <?php
  2. //start session
  3.  
  4. include_once('User.php');
  5.  
  6. $user = new User();
  7.  
  8. if(isset($_POST['login'])){
  9. $username = $user->escape_string($_POST['username']);
  10. $password = $user->escape_string($_POST['password']);
  11.  
  12. $auth = $user->check_login($username, $password);
  13.  
  14. if(!$auth){
  15. $_SESSION['message'] = 'Invalid username or password';
  16. header('location:index.php');
  17. }
  18. else{
  19. $_SESSION['user'] = $auth;
  20. header('location:home.php');
  21. }
  22. }
  23. else{
  24. $_SESSION['message'] = 'You need to login first';
  25. header('location:index.php');
  26. }
  27. ?>

home.php

This is our goto page after a successful login.

  1. <?php
  2. //return to login if not logged in
  3. if (!isset($_SESSION['user']) ||(trim ($_SESSION['user']) == '')){
  4. header('location:index.php');
  5. }
  6.  
  7. include_once('User.php');
  8.  
  9. $user = new User();
  10.  
  11. //fetch user data
  12. $sql = "SELECT * FROM users WHERE id = '".$_SESSION['user']."'";
  13. $row = $user->details($sql);
  14.  
  15. ?>
  16. <!DOCTYPE html>
  17. <html>
  18. <head>
  19. <title>PHP Login using OOP Approach</title>
  20. <link href="<a href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css"" rel="nofollow">https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css"</a> rel="stylesheet">
  21. </head>
  22. <body>
  23. <div class="container">
  24. <h1 class="page-header text-center">PHP Login using OOP Approach</h1>
  25. <div class="row">
  26. <div class="col-md-4 col-md-offset-4">
  27. <h2>Welcome to Homepage </h2>
  28. <h4>User Info: </h4>
  29. <p>Name: <?php echo $row['fname']; ?></p>
  30. <p>Username: <?php echo $row['username']; ?></p>
  31. <p>Password: <?php echo $row['password']; ?></p>
  32. <a href="logout.php" class="btn btn-danger"><span class="glyphicon glyphicon-log-out"></span> Logout</a>
  33. </div>
  34. </div>
  35. </div>
  36. </body>
  37. </html>

logout.php

Lastly, this contains our PHP code that destroys our user session.

  1. <?php
  2.  
  3. header('location:index.php');
  4. ?>

That ends this tutorial. Happy Coding :)


Comments

Shouldn`t the auto_increment be placed on id instead of username?

Add new comment

Filtered HTML

  • Web page addresses and e-mail addresses turn into links automatically.
  • You may insert videos with [video:URL]
  • Allowed HTML tags: <a> <em> <strong> <cite> <blockquote> <code> <ul> <ol> <li> <dl> <dt> <dd> <table> <tr> <td> <th> <img> <h1> <h2> <h3> <iframe> [video]
  • You can enable syntax highlighting of source code with the following tags: <code>, <blockcode>, <asp>, <c>, <cpp>, <csharp>, <css>, <html4strict>, <java>, <javascript>, <mysql>, <php>, <python>, <sql>, <vb>, <vbnet>. The supported tag styles are: <foo>, [foo].
  • Lines and paragraphs break automatically.

Plain text

  • No HTML tags allowed.
  • Lines and paragraphs break automatically.
CAPTCHA
This question is for testing whether or not you are a human visitor and to prevent automated spam submissions.