如果没有打开相同 url 的活动选项卡，则销毁 localStorage

Question

我今天遇到了一个问题，我试图保护用户经过身份验证的令牌。我使用会话存储来设置会话的到期时间和 javascript 无法访问的服务器端 cookie 来存储他们的身份验证令牌。目前的问题是，如果用户打开一个新选项卡，他将不会登录，因为 sessionStorage 中没有到期，但是令牌 cookie 仍然存在。我正在考虑将此类过期从 sessionStorage 移至 localStorage，以便用户在打开新选项卡时仍处于登录状态，但如果我的网站没有活动选项卡，我想删除此类 localStorage 条目。这可以检查吗？

Answer 1

您可以将到期日期设置为当前时间 + x（当 x 为短时间时，假设为一分钟）。然后编写一个 setInterval 调用以在您的选项卡处于活动状态时扩展它。类似于：

var expiration = new Date();
expiration.setMinutes(expiration.getMinutes() + 1);
window.localStorage.setItem('MyTokenExpiration', JSON.stringify(expiration));

window.setInterval(function() {
    var now = new Date();
    var tokenExpiration = new Date(JSON.parse(window.localStorage.getItem('MyTokenExpiration')));
    if(tokenExpiration.getSeconds() < now.getSeconds() + 30) {
        tokenExpiration.setMinutes(now.getMinutes() + 1);
        window.localStorage.setItem('MyTokenExpiration', JSON.stringify(tokenExpiration));
    }
}, 30000);

如果没有打开相同 url 的活动选项卡，则销毁 localStorage

Destroy localStorage if no active tabs for same url are open

javascript

cookies

session-storage

local-storage