How can I logout a user from all open tabs automatically when user logs out in one of them?

Question

I have created a Login page, amongst many others pages, which contains code to check the session. If the user doesn't have a session then all pages will reload and redirect to the logout page. This script is called every three seconds.

The code I've written is working fine but I want implement it another way. When the user logs out, all open tabs reload/refresh causing the user to be logged out. Is that possible?

sessioncheck.php:

<?php
session_start();
if(isset($_SESSION['username']) && $_SESSION['username'] != ''){
    echo "true";
}
else {
    echo "false";
}
?>

This code is in every page footer:

<script>
    function gettatus(){
        $.get("sessioncheck.php", function(data){
            if(!data) {
                window.location = "logout.php";
            }
            setTimeout(function(){
                checkLoginStatus();
            }, 3000);
        });
    }
    $(document).ready(function(){
        gettatus();
    });
</script>

You may want to have a look at http://stackoverflow.com/questions/28230845/communication-between-tabs-or-windows — dotpush, Feb 15 '17 at 15:48
Possible duplicate of [Logout all open tabs automatically when user logs out in one of them](http://stackoverflow.com/questions/13513874/logout-all-open-tabs-automatically-when-user-logs-out-in-one-of-them) — Vivek Nerle, May 03 '17 at 06:14

shukshin.ivan · Accepted Answer · 2017-02-11T22:19:54.570

When ajax is useful

Making an ajax request to your server every 3 seconds is useful just in case 1. you have opened tabs in different browsers 2. or in many computers. 3. or you use very old browsers

Setting cookie doesn't work.

Approach using setting cookie doesn't work since one tab is not aware of changed cookies in another tab. That's because of document (where cookies are got from with getCookie) of tab A is not changing without request to a server. You can open two tabs of SO and try to set setCookie('name', 'val', 1) in one tab and look at document.cookie in the other tab.

How to make another tabs knew about logout immediately

If you need to logout all tabs of the same browser, it would be great to pass signals between tabs. There are a couple of methods, I want to tell you about using localStorage (demo here).

You can attach a listener to a storage event (fired when storage item is changed) and send a logout-event signal.

localStorage.setItem('logout-event', 'logout' + Math.random());

Every other tab will get it with a listener.

window.addEventListener('storage', function(event){
    if (event.key == 'logout-event') { 
        // ..
    }
});

What if old browsers without localStorage

You can use both approaches - localStorage and auto-refresh, for example every 60 seconds, just to be sure it works when tabs are opened at different computers. If localStorage doesn't work (very old browsers), auto-refresh every 3 seconds.

The following fiddle shows how to deal with it.

What else?

You can use node.js + socket.io to send signals between all browsers of a user. It works rapidly and will logout a user on every device, but it is a little harder to deal with than a common jQuery.

Great answer. Solved big problem in my website. Thanks a lot man! — Savan S, Jul 24 '19 at 11:23
Another appreciation to shukshin.ivan for the effort posting this answer. — jan199674, Sep 27 '19 at 14:36
Keep in mind as MDN says "This won't work on the same page that is making the changes — it is really a way for other pages on the domain using the storage to sync any changes that are made" — Karolius, Aug 16 '20 at 21:15

ANIK ISLAM SHOJIB · Answer 2 · 2017-02-15T09:44:05.987

lets consider somethings that you are using php session and you are checking following code every time you are loading your pages or after some time duration

<?php
    session_start();
    if(isset($_SESSION['username']) && $_SESSION['username'] != '')
        echo true;
    else 
        echo false;
?>

So on your logout.php file you are probably doing something like this unset($_SESSION['username']); and session_destroy();

Therefore when your page will call that checking php you will find false in return and that following user will no longer get access from any browser and any pages. And For automatically logout try this

$sessionTTL = time() - $_SESSION["timeout"];
if ($sessionTTL > $inactive) {
    session_destroy();
    unset($_SESSION['username']);
    echo false;

Note: you must set $inactive = 6000;(for example) as global variable while login

score 0 · Answer 3 · answered Feb 08 '17 at 11:28

0

For this, you have two choices. Either store the session values in server and make Ajax requests frequently to server to check whether the user is still logged in or not. But this will make a huge server load and also consume network bandwidth of user. Or else,

check the logged in cookie still exists or not in browser frequently. This will be the good approach.

Both can be performed by setTimeout or setInterval

But the second one should be good.

answered Feb 08 '17 at 11:28

Sagar V

12,158
7
41
68

checking cookie is also perform by setTimeout or setInterval throughout ajax call? – Rushil K. Pachchigar Feb 09 '17 at 03:44
You have to use setTimeout or setInterval to check cookie, but you don't have to make an ajax call. Cookie can be checked at client side via javascript itself. – Sagar V Feb 09 '17 at 04:30
Without using Interval or Timeout, you can't determine whether the user is logged out or not – Sagar V Feb 09 '17 at 04:30
is that i have to do using ajax? – Rushil K. Pachchigar Feb 09 '17 at 04:50

Sagar V · Answer 4 · 2017-02-09T05:58:45.560

Here is what you need. In this, snippet shows some error I dont know why. So, please copy the javascript code to browser console(f12) and check it. It works When user login, you must use

setCookie('loggedin','true',1);

Here we are setting a cookie called logged in

 
function setCookie(cookiename, cookievalue, expdays) {
  var d = new Date();
  d.setTime(d.getTime()+(expdays * 24 * 60 * 60 * 1000));
  var expires = "expires=" + d.toUTCString();
  document.cookie = cookiename + "=" + cookievalue + "; " + expires;
}
function getCookie(cookiename) {
  var name = cookiename + "=";
  var startPos = document.cookie.indexOf(name);
  if(startPos == -1) return null;
  startPos+=(name.length);
  if(document.cookie.indexOf(";",startPos) == -1){
    return document.cookie.substring(startPos,document.cookie.length);
  }
  else{
    return document.cookie.substring(startPos,document.cookie.indexOf(';',startPos));
  }
return null;
}


function checkCookie() {
   var loggedin = getCookie("loggedin");
   if (loggedin && loggedin !=null) {
     // Logged in
     //do  nothing
   }
   else{
     window.location.href="login.php";
   }
}

<!-- use the below code in logged in home page to check whether the user is logged in still or not in a time interval of 1 second. Change 1000 as per your need.//-->
<body onload = "setTimeout(checkCookie,1000);">

shouldn't setTimeout be setInterval? – Matiaan Sep 04 '17 at 09:12 — Matiaan, Sep 04 '17 at 09:12

score 0 · Answer 5 · answered Nov 28 '18 at 14:33

0

Ajax requests frequently to server to check whether the user is still logged in or not. But this will make a huge server load and also consume network bandwidth of user

the load to the server disables this option. I've tested it.

answered Nov 28 '18 at 14:33

Apul

11
2

How can I logout a user from all open tabs automatically when user logs out in one of them?

5 Answers5

Linked