Cara Membuat Session Login Kadaluarsa Menggunakan AjaxJquery dan PHP

23/04/2019    Shelli Ripati    1378     Website

Session adalah suatu variable baru yang dibuat dengan sifat yang sementara. Session biasanya digunakan untuk membantu kita membuat proses login atau logout. Nah pada artikel kali ini saya akan membahas tentang Cara Membuat Session Login Kadaluarsa Menggunakan AjaxJquery dan PHP. Sebelumnya teman-teman buat database admin yang berisi kolom id, username dan password.

Langkah selanjutnya Cara Membuat Session Login Kadaluarsa Menggunakan AjaxJquery dan PHP yaitu membuat struktur html untuk tampilan login seperti script di bawah ini. Lalu simpan dengan nama login.php.

<?php  

  $connect = mysqli_connect("localhost", "dumet", "school", "test");

  session_start(); 

  if(isset($_POST["submit"])) { 

    $username = mysqli_real_escape_string($connect, $_POST["user"]);

    $password = mysqli_real_escape_string($connect, $_POST["pass"]);

    $query = "SELECT * FROM login WHERE username = '".$username."' AND password = '".$password."'";

    $result = mysqli_query($connect, $query);

    if(mysqli_num_rows($result) > 0){

      $_SESSION["user"] = $_POST["user"];

      header("location:index.php");

    }else{

      echo '<script>alert("Username atau Password Salah!")</script>';

    }   

  } 

?> 

<!DOCTYPE html> 

<html> 

<head> 

  <title>Cara Membuat Session Login Kadaluarsa Dengan AjaxJquery dan PHP</title>

  <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/js/bootstrap.min.js"></script>

  <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css" /> 

  <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/js/bootstrap.min.js"></script>

  <style> 

    #box{ 

      width:600px; 

      background:salmon; 

      color:white; 

      margin:0 auto; 

      padding:10px; 

      text-align:center; 

      margin-top:100px;

    } 

  </style> 

</head> 

<body> 

  <div id="box">

    <h2>Login</h2> 

    <form method="post"> 

      <input type="text" name="user" id="user" placeholder="Enter Username" class="form-control" /><br /> 

      <input type="password" name="pass" id="pass" placeholder="Enter Password" class="form-control" /><br /> 

      <input type="submit" name="submit" id="submit" class="btn btn-info" value="Submit" /> 

    </form>  

  </div> 

</body>

</html>

Jika sudah maka teman-teman buat file baru dengan nama index.php yang berisi struktur html untuk membuat halaman admin dan fungsi ajax untuk melakukan pengecekan dari status session dan fungsi tersebut akan dijalankan sesuai waktu yang kita tentukan dengan menggunakan setInterval.

<!DOCTYPE html> 

 <html> 

  <head> 

    <title>Cara Membuat Session Login Kadaluarsa Menggunakan AjaxJquery dan PHP</title>

    <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.2.0/jquery.min.js"></script>

    <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css" /> 

    <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/js/bootstrap.min.js"></script>

    <style> 

      #box{ 

           width:600px; 

           background:gray; 

           color:white; 

           margin:0 auto; 

           padding:10px; 

           text-align:center; 

      } 

    </style> 

  </head> 

  <body> 

    <?php 

    session_start(); 

    if(isset($_SESSION["user"])) { 

      echo "<h1 align='center'>Halaman Admin</h1>";

      echo "<h1 align='center'>".$_SESSION["user"]."</h1>"; 

      echo "<p align='center'><a href='logout.php'>Logout</a></p>"; 

    } else { 

      header('location:login.php'); 

    } 

    ?> 

  </body> 

 </html>  

<script> 

  $(document).ready(function(){ 

    function check_session(){

      $.ajax({

        url:"check_session.php",

        method:"POST",

        success:function(data){

          if(data == '0'){

            alert('Session sudah kadaluarsa. Silahkan login kembali!'); 

            window.location.href="login.php";

          }

        }

      })

    }

    setInterval(function(){

      check_session();

    }, 5000);

  }); 

</script>

Dan untuk membantu pengecekan session teman-teman buat file baru dengan nama check_session.php dan berikut scriptnya.

<?php 

session_start();

if(isset($_SESSION["user"])) { 

  echo '0';   //session Belum Kadaluarsa  

}else{ 

  echo '1';  //session Kadaluarsa 

}

?>

Langkah terakhir maka buat file logout.php untuk proses keluar dan berikut ini scriptnya.

<?php   

 session_start(); 

 session_destroy(); 

 header('location:login.php'); 

 ?>

Jika ditampilkan di halaman browser maka akan tampil seperti gambar di bawah ini.

Tampilan Halaman Login

Tampilan Halaman Admin

Tampilan Alert Kadaluarsa di Halaman Admin

Demikian artikel tentang Cara Membuat Session Login Kadaluarsa Menggunakan AjaxJquery dan PHP.

 

No data.

Cara Cepat Pintar Membuat Website, Tanpa Perlu Basic IT

Membuat website perusahaan, portal berita, blog, katalog online, dan e-commerce.

Learn More

Cara Cepat Pintar Membuat Website, Tanpa Perlu Basic IT

Membuat website perusahaan, portal berita, blog, katalog online, dan e-commerce.

Learn More