Javascript 如何在“关闭”选项卡上以Angular 10实现注销，并防止通过鼠标或按键刷新或重新加载 我可以在“关闭”选项卡上注销。但当鼠标重新加载或刷新时，它也会被注销。 如何处理这些问题 如何使这些事件在整个应用程序中触发，而不仅仅是针对Home组件

不幸的是，关闭浏览器选项卡（窗口）或重新加载/刷新窗口之间没有区别——它都注册为一个事件，即卸载DOM窗口元素的内容

有几种处理方法。一种方法是在根组件（通常称为

AppComponent

）中绑定“beforeunload”事件，然后在那里响应该事件。。。。因为它是根组件，所以应用程序范围很广

---

不确定是否有任何浏览器级事件可用于处理刷新和重新加载。我们可以使用会话存储来处理这个场景，我们需要在第一次加载时存储一些密钥，并且在每次刷新或重新加载时，我们可以不断检查密钥是否存在

假设我们有一个条件来检查根组件的ngOnInit方法上是否存在密钥。如果密钥存在，则会重新加载或刷新密钥。如果它不存在，那么它是第一次加载，我们需要保存密钥

---

关闭时，会话存储将被清除。

1）对于一个注册的事件，我们只能在“关闭”选项卡中进行区分。或者我还有其他方法可以做到这一点吗？很抱歉，我无法区分这一点，对不起。。。。beforeunload事件（和行为不一致的事件）上确实存在错误-请参阅：在浏览器关闭上，会话正在被清除，这很好。我还想在关闭选项卡。

import { Component, HostListener, Inject } from '@angular/core';
@Component({
    selector: 'app-home',
    templateUrl: './home.component.html',
    styleUrls:['./home.component.scss']
})
export class HomeComponent {
    User: any;
    isRefreshed = false;
    @HostListener('window:beforeunload', ['$event'])
    onBeforeUnload(event: Event) {
        console.log('isrefreshed', this.isRefreshed);
        if (!this.isRefreshed) {
            this.User.logout();
        }
    }
    constructor(@Inject('User') userProvider) {
        this.User = userProvider;
        window.addEventListener('keydown', event => {
            console.log('Key Pressed ==>', event, this.isRefreshed);
            if (event.key == 'r' || event.key == 'F5') this.isRefreshed = true;
        });
    }

}