我需要JavaScript (Angular)事件监听器关闭页面和选项卡

Question

我需要事件，将在关闭页面或选项卡上工作，但也不会触发刷新页面。我知道"beforeunload"，但它在刷新页面时仍然有效。

我的代码

@HostListener('window:beforeunload', ['$event'])
checkIsUserLogOut() {
if (ConfigurationModel.applicationOptions.autoLogOutWhenWebBrowserClosed) {
localStorage.removeItem('auth_token');
localStorage.removeItem('auth_token_expires_on');
}
}

Answer 1

找到了一篇关于精确问题的文章(不希望在刷新时触发代码)。

它使用一个localStorage变量来保存最后一个unload事件的日期时间，如果少于预设的时间，则认为它是一次刷新。

unload事件处理程序:

function unload(event) {
if (window.localStorage) {
// flag the page as being unloading
window.localStorage['myUnloadEventFlag']=new Date().getTime();
}
askServerToDisconnectUserInAFewSeconds(); // synchronous AJAX call
}

on page load:

function myLoad(event) {
if (window.localStorage) {
var t0 = Number(window.localStorage['myUnloadEventFlag']);
if (isNaN(t0)) t0=0;
var t1=new Date().getTime();
var duration=t1-t0;
if (duration<10*1000) {
// less than 10 seconds since the previous Unload event => it's a browser reload (so cancel the disconnection request)
askServerToCancelDisconnectionRequest(); // asynchronous AJAX call
} else {
// last unload event was for a tab/window close => do whatever
}
}
} 

希望有帮助。