Angular5:window.addEventListener卡在浏览器选项卡上

Question

我的应用程序有多个标签支持.所以我将所有数据保存在localStorage中.该应用程序也具有套接字支持,并且成功登录后,我必须通过发出事件来授权套接字.

现在在一个场景中,如果用户在登录前打开了多个选项卡,然后从其中一个选项卡登录,那么所有选项卡应该同步工作.

所有选项卡都会获得令牌,因为我已将令牌存储在本地,但有了这个,我还必须授权我的套接字,因为所有选项卡都将具有单独的套接字实例.

我需要一些事件来触发事件到所有其他选项卡来授权套接字实例.为此,我使用了参考堆栈代码中的以下标签监听器,但它粘在我的浏览器选项卡上.

window.addEventListener('storage', (event) => {
  if (event.newValue === 'socketAuth') {
    if (event.key === 'sendAuth') {
      console.log('Send Auth Event');
    } else if (event.newValue === 'disconnect') {
      console.log('Disconnect Socket');
    }
  }
});

它在我的一个演示中工作正常但不在此.我需要做的任何修正或任何其他方式来实现这一点.我的应用程序代码在Angular5中.