通过监听localStorage,实现多窗口通信

场景:多个窗口同时登陆,其中一个窗口进行退出登录操作后其他窗口同步退出登录

1、登录时保存一个标识在localStorage,用于判断是否退出登录,同时进行localStorage监听

  // 保存标识
  localStorage.setItem(标识字段,)
  // 监听localStorage localStorageWatch为localStorage变化时的执行方法
  window.addEventListener('storage', localStorageWatch)

2、在其中一个窗口退出登录时的逻辑处理

const localStorageWatch = (e: any) => {
  if (e.key === 标识字段 && e.newValue !==) {
    // 跳转未登录是的页面
	...
	// 清空缓存
	localStorage.clear()
	sessionStorage.clear()
	// 清除监听localStorage
    window.removeEventListener('storage', localStorageWatch)
  }
}
评论 2
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值