如何用Supabase Auth识别Next.js应用中的活跃用户？

一、先搞定会话残留的问题 #

你现在退出后会话还存在，核心原因是会话销毁不彻底，得从这几个点入手：

• 用户点击退出时，主动销毁会话：不管用内存、Redis还是数据库存储会话，必须调用对应销毁方法。比如用Express框架的话，直接执行req.session.destroy()，同时要清除前端的会话Cookie，避免残留Cookie还能关联到旧会话。
• 给会话加强制过期时间：就算用户不主动退出，会话也不能永久有效。比如设置30分钟无操作就过期，或者每天凌晨自动清理所有过期会话。用Redis存会话的话，直接给会话键加EX过期时间；存在数据库就加个expires_at字段，写个定时脚本删除过期记录。
• Google OAuth退出要同步：调用Google的注销接口，把第三方身份会话也干掉，不然用户重新进入应用可能会自动登录，等于没真正退出。

二、在线用户识别与绿色徽章的实现方案 #

方案1：基于活动时间戳的简单实现 #

这是最容易落地的方案，适合小型应用：

• 核心逻辑：给每个用户加个last_active_at字段，用户每做一次操作（比如点击页面、发送请求）就更新这个时间戳。
• 判断在线：查询数据库时，只要last_active_at在最近5分钟内，就判定为在线，显示绿色徽章。
• 具体操作：
  • 前端在页面加载、用户操作时（可以加防抖，避免频繁发请求）调用后端接口更新活动时间。
  • 数据库查询示例（PostgreSQL）：SELECT id, username FROM users WHERE last_active_at >= NOW() - INTERVAL '5 minutes';
  • 前端拿到在线列表后，给对应用户的头像/名称旁添加绿色徽章即可。

方案2：WebSocket实时同步（适合对实时性要求高的场景） #

如果需要实时显示用户上线/下线状态，用WebSocket更靠谱：

• 核心逻辑：用户登录时建立WebSocket连接，关闭页面或退出时断开连接，后端实时维护在线用户集合。
• 判断在线：只要WebSocket连接存在，就标记为在线；断开后加30秒缓冲（防止网络波动误判），再标记为离线。
• 具体操作：
  • 后端用WebSocket库（比如Socket.io）维护在线用户列表，用户连接时加入集合，断开时移除。
  • 前端实时接收在线列表更新，动态渲染绿色徽章，不用轮询数据库。

方案3：混合方案（兼顾实时性和容错） #

担心WebSocket不稳定的话，把两种方案结合：用WebSocket处理实时状态，同时记录last_active_at作为兜底。如果WebSocket断开但last_active_at还在有效期内，先暂时标记为在线，过段时间再改为离线。

三、最优方案选择建议 #

• 小型应用、对实时性要求不高：直接用方案1，代码量少，维护简单。
• 中大型应用、需要实时显示在线状态：选方案2或混合方案，用户体验更好。
• 注意：不管选哪种方案，必须先解决会话残留问题，不然用户明明已退出，会话还存在，在线状态判断肯定会出错。

内容的提问来源于stack exchange，提问作者Judeson