当用户注销其中一个选项卡时，如何自动从所有打开的选项卡中注销用户? [英] How can I logout a user from all open tabs automatically when user logs out in one of them?

问题描述

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

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>

推荐答案

当 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(cookie 是从 getCookie 中获取的)在没有请求服务器的情况下不会改变.您可以打开 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(demo here).

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

您可以使用两种方法 - 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屋！