PHP Session Timeout + Login Popup with Ajax Login

Why popup login modal box session timeout in PHP using Ajax. Sometime when we are browsing some sensitive or private website we must have to face login and registration. So when we are using this website and we open multiple pages, the browser will allow us. But when we log out and forgot to close other pages in different tab which has been opened that may access by some others, else suppose we have written some task but we don’t know that session has expired so when we submit that task page came out to index page or home page, means unsaved task has gone!. To get rid this kind of confusion many of websites providing modal popup if the session has expired, so the user could save his work before submitting the task.

Here this is the done by using PHP, Ajax, and MySql as backend. Before working on this we should know how Ajax works else you can check the ajax tutorials. I will explain you the step by step from scratch.
If you want to download the sample code, below the download link has given. Before going to the full tutorial we need to know some basic functions used ever here.

We need to know about the login in PHP using Ajax.

I will give a brief explanation in Ajax. Sample Ajax code I have given below.

$.ajax({ 
url:"samplepage.php",
method:"POST",
data:$(this).serialize(),
success:function(data){
  if(data != '')
  {
  //
  }
  else
  {
  //
  }
 }
});

$.ajax({

url:"samplepage.php",

method:"POST",

data:$(this).serialize(),

success:function(data){

if(data != '')

{

}

else

{

}

});

Ajax is the Asynchronous JavaScript and XML.
In literal meaning, without refreshing a page we have to fetch data from the database and render HTML and populate or perform some task like here we have to make login functionality without page refresh. we need to take form data by this method $(this).serialize() then validate with PHP and then match with database data using MySQL.

Ajax functionality performed by below parameters:
url, method and data Then We will have one callback is calledsuccess.
If you want any tutorials about Ajax, please put a comment in comment section. We will provide you the best tutorial for you.

Modal popup

This is a default functionally of bootstrap. So as of now, we are using bootstrap we can get easily.
I have given a sample code below for understanding purpose.

Modal popup tutorial

The most Important default Javascript function I have added.

setInterval() and clearInterval();

Now we can check session is expired or not with some time interval of time. Here I have taken 10 sec.
so set interval will be called each 10 sec that functions whether the session exists or expired.
But when it get encounter by session expired then no need to check again, so at this time we need clearInterval().

UserName – admin@gmail.com
Password – admin

PHP Session Timeout + Login Popup with Ajax Login

You can download this code.