如何监听浏览器中同一域名的 tab 全部关闭？

window.Onload= () => {
const count = parseInt(localStorage.getItem('count') || '0', 10);
localStorage.setItem('count', count + 1 + '');

const lastExitTime = parseInt(sessionStorage.getItem('lastExitTime') || '0', 10);
// 三秒内回来，表示是刷新了
if (lastExitTime && Date.now() - lastExitTime < 30000) {
// TODO 发送接口 还原登录状态
}
};

window.Onbeforeunload= (event) => {
const count = parseInt(localStorage.getItem('count') || '0', 10);
localStorage.setItem('count', count - 1 + '');
if (count <= 1) {
// TODO 但是其实这里无法区分是刷新还是关闭。 需要后端
sessionStorage.setItem('lastExitTime', Date.now().toString());

// TODO 发送接口退出
// 发送网络请求建议使用 sendBeacon https://developer.mozilla.org/zh-CN/docs/Web/API/Navigator/sendBeacon

// 注意：页面必须有用户操作才能正常拦截
event.preventDefault();
event.returnValue = '所有都关闭了';
return '所有都关闭了';
}
};

用 BroadcastChannel 向其他标签广播，没有回应说明是最后一个标签，然后用 sendBeacon 向服务器发送信息

当前的浏览器都没法区分开“关闭标签页跟刷新事件”

无法监听，over 。你要是想退出可用心跳，让服务端判断

每个 tab 页分配个唯一 id , 集合形式存到 local storage .tab 页关闭时判断集合长度

@v2eb 关闭和刷新分不出来的，只有一个 tab 一刷新结果登出了？

不妨想想为什么登出一定要调用 logout 接口，不调用会有什么后果？是后端有资源要释放么？用户浏览器直接崩也是可能没机会调用 js 的 unload 的，所以关键逻辑不能依赖 logout 接口。

session 行为就是这样的. 不需要前端干预. 这帮后端不行,还要前端背锅?

这需求有啥奇葩的...
这不是动态网页出来这二三十年的最基本的一个操作^

@realpg 这还不奇葩？这跟动态网页有什么关系？你哪怕是 windows 客户端也不能保证用户退出就一定能调用到服务端的 logout 接口。我强杀进程，直接强制关机等等，都可能导致客户端直接就消失不调用你的 logout 接口。

logout 是要干什么？统计在线人数么？还是释放啥资源还是什么？非要强依赖客户端在线与否，那只能建立 socket 或者让客服端发心跳。期望客户端恭恭敬敬给你调用 logout ，那只能说无法保证。

@chnwillliu #34
现在的开发者连有个东西叫 session,有个东西叫 cookie 都不知道了

@chnwillliu #34
而且, 不依赖 cookie, 也可以用 localstorage 和 sessionstorage 实现他要求的掉登录状态机制

这玩意还真实现了一个，上面大家说 cookie 之类的，是可以，但是后端不改怎么办，整个用户体系都是基于 token 的，改不现实，需求还是提给前端的。
用 BroadcastChannel ，可以 tab 之前通信，退出的时候发通知，所有页面订阅，我把代码放在 nginx 里注入到项目里，这样业务不需要关注

凡是让客户端主动去调的，不管用什么，全不靠谱。各种异常情况、兼容问题，不要想当然

@realpg 依赖 session 类型的 cookie 然后捏？怎么在合适的时候调用 logout 接口？所以说要改实现，因为没法保证调用后端的 logout 接口。

还有哦，sessionStorage 和 session 类型的 cookie 行为不一致。sessionStorage 不跨 tab.

@realpg 对，其实用 session 类型的 cookie 存东西就行，用户关了所有 tab 自动被清掉。用 sessionStorage 存的话要考虑跨 tab 共享问题，解决完这个问题，行为就和 session cookie 一致了。

利用好了，根本就不要什么 logout 接口。

感谢大家，最后改需求了，沿用目前方案，遵循浏览器默认行为，完全关闭浏览器后退出登录。