Minggu, 25 Maret 2018

Membuat from login menggunakan php dan koneksi Database.


Setiap data/file yang benghubungan dengan database pasti akan akan bersifat prifasi/pribadi.dengan kata lain hanya yg dia lah yang boleh tau,oleh sebab itu harus ada sebuah pengamanan.
Dan kali ini saya akan mencontohkan sebuah keamanan database sederhana dengan menggunakan PHP dan Mysql
Mari di simak:

Untuk memulai ada hal-hal yang harus di persiapkan:
1.      XAMPP
2.      Bootstrap 4
3.      Jquery
4.      Editor bisa Atom, NetBeans dll.
Untuk logika/algoritma dari from login urutan seperti ini:

Algoritma :
1.      start
2.      Input user dan pass
3.      test username dan pessword cocok  apa belum dan status field baned = N
4.      Jika YES login sukses
5.      Jika NO, cek apakan yser sudah dibaned
6.      Jika NO cek lagi apakah jumlah logintime > 3
7.      Jika NO maka edit field logintime ditambah 1 lalu kembali ke tahap 2.
8.      Jika YES maka edit field baned menjadi Y dan user terblokir

Kalo masih bingin flowchat seperti di bawah:

Langkah-langkah:

1.jalankan XAMPP contoh:




2.Buat database baru di localhost/phpmyadmin contoh:



Setelah membuat database sekarang membuat table,dengan ketikan Query seperti dibawah:

CREATE TABLE `data_user` (
`id` int(11) NOT NULL PRIMARY key,
`username` varchar(25) NOT NULL UNIQUE,
`fullname` varchar(25) DEFAULT NULL,
`pasword` varchar(25) NOT NULL,
`baned` enum('N','Y') NOT NULL DEFAULT 'N',
`logintime` int(2) DEFAULT '0'
);

Maka akan menjadi seperti ini:



setelah itu isi databasenya, silahkan isi sesuai selera contoh:




3.buat folder baru di C:\xampp\htdocs dan saya di sini menggunakan Atom maka akan seperti ini:



Jika sudah maka akan seperti ini:


4.buat susunan folder seperti ini:





5.Buat file index.php lalu sinpan di Login014 dan masukkan code di bawah:

<?php
error_reporting(0);
session_start();
    include_once 'config/dao.php';
    $user = new Dao();
    if ($user->get_session()){
       header("location:home.php");
    }
?>

<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <meta name="author" content="Kodinger">
    <title>My Login Page &mdash; Bootstrap 4 Login Page Snippet</title>
    <link rel="stylesheet" type="text/css" href="assets/bootstrap/css/bootstrap.min.css">
    <link rel="stylesheet" type="text/css" href="assets/css/my-login.css">
</head>

<body class="my-login-page">
    <form id="login" name="login" action="login.php" method="POST" class="form-signin">
        <section class="h-100">
            <div class="container h-100">
                <div class="row justify-content-md-center h-100">
                    <div class="card-wrapper">
                        <div class="brand">
                            <img src="assets/img/logo.png">
                        </div>
                        <div class="card fat">
                            <div class="card-body">
                                <h4 class="card-title">Login</h4>
                                <form method="POST">

                                    <div class="form-group">
                                        <label for="email">E-Mail Address</label>
                                        <input id="username" type="teks" class="form-control" name="username" value="" required autofocus>
                                    </div>
                                    <div class="form-group">
                                        <label for="password">Password
                                            <a href="forgot.html" class="float-right">
                                                Forgot Password?
                                            </a>
                                        </label>
                                        <input id="password" type="password" class="form-control" name="password" required data-eye>
                                    </div>

                                    <div class="form-group">
                                        <label>
                                            <input type="checkbox" name="remember"> Remember Me
                                        </label>
                                    </div>

                                    <div class="form-group no-margin">
                                        <button type="submit" class="btn btn-primary btn-block">
                                            Login
                                        </button>
                                    </div>
                                    <div class="margin-top20 text-center">
                                        Don't have an account? <a href="register.html">Create One</a>
                                    </div>
                                </form>
                            </div>
                        </div>
                        <div class="footer">
                            Copyright &copy; Andiyanto
                        </div>
                    </div>
            </div>
        </div>
    </section>
    </form>
    <script src="assets/js/jquery.min.js"></script>
    <script src="assets/bootstrap/js/bootstrap.min.js"></script>
    <script src="assets/js/my-login.js"></script>
</body>
</html>


6.Buat konfigurasi database didalam folder confing dengan nama file db_config.php dan masukkan code di bawah ini:
“Catatan nama DB_NAME harus sama seperti database yang di buat”

<?php

 //inisialisasi variabel data pada database
define('DB_HOST','localhost');
define('DB_USER','root');
define('DB_PASS','');
define('DB_NAME','login');


// membuat class oop untuk koneksi database
class Dbconfig {
  var $conn;
  function __construct() {
      $this->conn = new mysqli(DB_HOST, DB_USER, DB_PASS, DB_NAME);
      if($this->conn->connect_error){
        echo $this->conn->connect_error;
      }
  }
  function ret_obj(){
    return $this->conn;
  }
}
?>

7. buat file dao.php dan masukkan di filder confing dan masukkan code di bawah:

<?php
include_once 'db_config.php';

class Dao
{
  var $link;
  public function __construct() {
    $this->link = new Dbconfig();
    $this->link = $this->link->ret_obj();
  }

  // proses login
    public function check_login($username, $password){
      $query = "SELECT id from data_user WHERE username='$username' and pasword='$password' and baned='N'";
      $result = $this->link->query($query) or die($this->link->error);
      $user_data = $result->fetch_array(MYSQLI_ASSOC);
      $count_row = $result->num_rows;
      $query2= "SELECT baned from data_user where username= '$username'";
      $result2 = $this->link->query($query2) or die($this->link->error);
      $user_data2 = $result2->fetch_array(MYSQLI_ASSOC);
      $ban = $user_data2['baned'];
      if ($count_row == 1) {
        //mengembalikan logintime ke 0 jika berhasil login
        $qry = "UPDATE data_user SET logintime = 0 where username='$username'";
        $reset= $this->link->query($qry) or die($this->link->error);
        //session untul digunakan di halaman lain sebagai tanda kalau sudah login apa belum
        $_SESSION['login'] = true;
        $_SESSION['id'] = $user_data['id'];
        return true;
      }else if ('Y'===$ban){
        echo "<script type=text/javascript>
        alert('Username $username Telah Di Blokir, Silahkan Hubungi Administrator');
        window.location = 'index.php'
        </script>";
        return false;
      }else {
        $query = "UPDATE data_user SET logintime = logintime + 1 where username='$username'";
        $result = $this->link->query($query) or die($this->link->error);
        $query2= "SELECT logintime from data_user where username= '$username'";
        $result2 = $this->link->query($query2) or die($this->link->error);
        $user_data = $result2->fetch_array(MYSQLI_ASSOC);
        $cuk = $user_data['logintime'];
        if($cuk > 3){
          $query = "UPDATE data_user SET baned = 'Y' where username='$username'";
          $result = $this->link->query($query) or die($this->link->error);
          echo "<script type=text/javascript>
          alert('Username $username Telah Di Blokir, Silahkan Hubungi Administrator');
          window.location = 'index.php'
          </script>";
        }else {
          echo "<script type=text/javascript>
                  alert('Username Atau Password Tidak Benar Anda, Sudah $cuk Kali Mencoba');
                  window.location.href='index.php'
                  </script>";
        }
        return false;
      }
  }

  //mengambil nama lengkap
  public function get_fullname($uid){
    $query = "SELECT fullname FROM data_user WHERE id = $uid";

    $result = $this->link->query($query) or die($this->link->error);
    $user_data = $result->fetch_array(MYSQLI_ASSOC);
    echo $user_data['fullname'];
  }

  // memulai session
  public function get_session(){
    return $_SESSION['login'];
  }

  // fungsi logout
  public function user_logout() {
      $_SESSION['login'] = FALSE;
      unset($_SESSION);
      session_destroy();
      }
}
?>

8.buat file login.php dan masukkna ke dalam folder Login014 Dan masukkan code di bawah:

<?php
session_start();
include_once 'config/dao.php';
$user = new Dao();


if ($_SERVER["REQUEST_METHOD"] == "POST")
{
    $login = $user->check_login($_POST['username'], $_POST['password']);
    if ($login)
    {
        // Login Success
        header("location:home.php");
    }
    else
    {
        // Login Failed
        echo "password salah";
    }
}

9.buat file home.php di folder Login014 dan masukkan code di bawah:

<?php
session_start();
    include_once 'config/dao.php';
    $user = new Dao();
    $uid = $_SESSION['id'];
    if (!$user->get_session()){
       header("location:index.php");
    }
    if (isset($_GET['q'])){
        $user->user_logout();
        header("location:index.php");
    }
?>
<!DOCTYPE html>
<html>
    <head>
        <meta charset="UTF-8">
        <title></title>
        <link rel="icon" href="assets/images/favicon.ico">
        <link rel="stylesheet" href="assets/bootstrap/css/bootstrap.css">
        <link rel="stylesheet" href="assets/css/navbar-top-fixed.css">
    </head>
    <body>
      <nav class="navbar navbar-expand-lg navbar-light bg-light fixed-top">
        <button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarTogglerDemo01" aria-controls="navbarTogglerDemo01" aria-expanded="false" aria-label="Toggle navigation">
        <span class="navbar-toggler-icon"></span>
        </button>
        <div class="collapse navbar-collapse" id="navbarTogglerDemo01">
          <a class="navbar-brand" href="#">RealmApps</a>
          <ul class="navbar-nav mr-auto mt-2 mt-lg-0">
            <li class="nav-item active">
              <a class="nav-link" href="#">Home <span class="sr-only">(current)</span></a>
            </li>
            <li class="nav-item">
              <a class="nav-link" href="#">Link</a>
            </li>
            <li class="nav-item">
              <a class="nav-link disabled" href="#">Disabled</a>
            </li>
          </ul>
          <form class="form-inline my-2 my-lg-0">
            <span class="mr-sm-3"> Hi, <?php $user->get_fullname($uid); ?></span>
            <a class="btn btn-primary" href="home.php?q=logout" role="button">Logout</a>
          </form>
        </div>
      </nav>
    </body>
</html>

Maka akan seperti ini:


10.setelah semuanya siap ketikan localhost/Login014 contoh:





Dan test dengan pasword yang benar jika ok maka tidak error.






Setelah itu boba masuk dengan user dan pass yang salah jika jalan maka akan seperti ini:





Sekian dan terimakasih belajar web susah tapi asik jadi jangan menyerah......!!!!!!
























Featured Post

Mengetahui tentang tag-tag HTML5

STRUKTUR HTML  HTML5 adalah versi terbaru dari HTML yang statusnya sudah direkomendasikan oleh W3C walau belum 100% sempurna, tapi beb...