Question

我发现很多关于如何在关闭标签页或窗口时执行脚本或警报的问答。但是，假设您进行了身份验证，并且希望将您的JWT保存在localStorage（LS）中。只要你的令牌还活着，你就可以从LS中取回它。

当我关闭标签或窗口时，我想明确删除我的标记（ Ctrl + W 或 Ctrl + F4 或 Alt + F4 ）

我提出了在我的页面的前载上定义脚本的想法，如下所示：

<script>
$(window).on('beforeunload', function(event){
   window.localStorage.removeItem("myID");
});
</script>

但后来我意识到，在刷新 F5 时，onbeforeunload将执行，我将清除LS。

然后我提出了这个解决方案

<script>
var clearLocalStorage = true;
$(window).on('keydown', function(event){
   if(event.keyCode == 116 ||  //F5
        (k == 16 && k == 17 && k == 82) ||  //Shift + Ctrl + R
        (k == 17 && k == 82)){  //Ctrl + R
      clearLocalStorage = false;
      event.preventDefault();
   }
});

$(window).on('beforeunload', function(event){
   if(clearLocalStorage){
      window.localStorage.removeItem("myID");
   }
});
</script>

这适用于 F5 ，因为它不会清除我的LS，但如果我执行 Ctrl + R ，它将会丢失我的来自LS的令牌。

登录后我想把我的令牌放在LS上......然后......

在刷新时，无论如何，它都应该始终保持来自LS的令牌 Ctrl + R 或 Shift + Ctrl + R
点击浏览器的URL地址，然后按 Enter 重新加载页面。
仅在用户关闭标签页或窗口时清除。如果您重新打开标签页，则需要再次登录页面。

我已经想在关闭onClose事件窗口时控制LS，如下所示，但它没有工作，因为我在开发人员工具的控制台上查询LS我可以看到令牌还在那里。

<script>
   window.onClose = function(){
      window.localStorage.removeItem("myID");
   }
</script>

我想知道在使用jquery，jwt，html和angularjs 1.5刷新和/或关闭标签或窗口时管理LS和令牌会话的最佳方法是什么？

提前致谢。

Answer 1

尝试定时活动：

var clearLocalStorage = true;
$(window).on('keydown', function(event){
   if(event.keyCode == 116 ||  //F5
        (k == 16 && k == 17 && k == 82) ||  //Shift + Ctrl + R
        (k == 17 && k == 82)){  //Ctrl + R
      clearLocalStorage = false;
      event.preventDefault();
   }
});

$(window).on('beforeunload', function(event){
  setTimeout(function(){
    if(clearLocalStorage)
       window.localStorage.removeItem("myID");
    else
      window.localStorage.persistItem("myID"); // make a persistent item in case
    }, 10); // I don't recommend anything above 100ms
});

保持/清除标签/窗口上的localStorage / session的最佳方法

1 个答案: