用户在其中一个注销时如何从所有打开的选项卡中注销 [英] How user will Logout from all open tabs automatically when user logs out in one of them

问题描述

我创建了一个Login页面以及许多其他页面，其中包含用于检查会话的代码.如果用户没有会话，则所有页面都将重新加载并重定向到注销页面.每三秒钟调用一次此脚本.

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";
}
?>

此代码在每个页脚中:

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

推荐答案

当ajax有用时

每3秒向您的服务器发出一个ajax请求很有用，以防万一 1.您已经在不同的浏览器中打开了标签页 2.或在许多计算机中. 3.或者您使用的浏览器很旧

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

设置cookie无效.

使用设置Cookie的方法不起作用，因为一个选项卡不知道另一选项卡中已更改的Cookie.这是因为选项卡A的document(使用getCookie从cookie中获取cookie)在没有请求服务器的情况下不会更改.您可以打开SO的两个选项卡，然后尝试在一个选项卡中设置setCookie('name', 'val', 1)，然后在另一个选项卡中查看document.cookie.

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.

如何使其他选项卡立即了解注销

如果您需要注销同一浏览器的所有选项卡，则在选项卡之间传递信号会很棒.有两种方法，我想告诉您有关使用localStorage的方法(此处为演示).

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).

您可以将侦听器附加到storage事件(当更改存储项时触发)并发送logout-event信号.

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') { 
        // ..
    }
});

如果没有localStorage

What if old browsers without localStorage

您可以同时使用两种方法-localStorage和自动刷新，例如每60秒一次，以确保在不同计算机上打开选项卡时它都可以工作.如果localStorage不起作用(非常旧的浏览器)，则每3秒自动刷新一次.

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.

以下小提琴显示如何处理它.

还有什么?

您可以使用 node.js + socket.io 在用户的所有浏览器之间发送信号.它工作迅速，可以在每台设备上注销用户，但是比普通的jQuery难处理一点.

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.

这篇关于用户在其中一个注销时如何从所有打开的选项卡中注销的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！