关闭角度应用程序的最后一个浏览器选项卡

Question

我想在关闭最后一个浏览器选项卡时注销我的应用程序。我在我的应用组件中添加了 @HostListener。在构造函数中安慰 tabcount 给出了打开选项卡的准确计数，但无法理解为什么我的条件不符合我的要求。目前它总是让我退出。

app.component.ts

constructor(
    private authService: AuthService
) {
    console.log(tabCount.tabsCount());
}

// Handle session on browser tab close . . .
@HostListener('window:beforeunload', ['$event'])
public beforeunloadHandler($event) {
    console.log(tabCount.tabsCount());
    if (localStorage.getItem('rememberMe') == null){
        if (tabCount.tabsCount() == 1){
            console.log(tabCount.tabsCount());
            this.authService.logout();
        }
    }
}

退出方式：

logout(): void {
    $('.modal').modal('hide');
    localStorage.removeItem('accessToken');
    localStorage.removeItem('session_data');
    this.router.navigate(['/login']);
}

Answer 1

如果没有更多信息（tabsCount 实现会很有帮助），我只能建议以下几点：

1. 同时打开 3 个标签。当您关闭第三个时，它会注销您吗？
2. 如果您刷新最后打开的选项卡，这将不起作用。此事件会在您关闭窗口时触发，并且在您刷新它时也会触发，因此这很可能会给您的应用程序带来一些副作用。

我的猜测是你使用本地存储like here来获取选项卡的数量，并且计算出了问题。