每次用户刷新时聊天显示用户断开连接

Question

聊天应该向其他用户显示，如果他转到站点中的另一个页面或如果他关闭选项卡，则有人离开了，但对于服务器刷新也算作用户离开，因此它会再次显示并每次重新加载时再次。有什么方法可以知道用户是刷新还是关闭了标签页？如果没有还有什么可以推荐的吗？

服务器端： `

    socket.on('disconnect', ()=> {

      const user= userleave(socket.id);

      io.emit('userdisconnected',user)

    })

前端：

    socket.on('userdisconnected',function outputdisconnect(data){
        
            let div = document.createElement('div')
            div.classList.add('output')
            div.innerHTML = '<p>' + data.username+ ' has left the chat</p>'
            chatwindow.appendChild(div)
        
    })

Answer 1

您可以做的是在发送 userdisconnected 之前等待 3-4 秒，如果同一用户在此期间再次连接则跳过它。

要大致了解一下，您可以这样做：

const waitingForDisconnectCheck = {};

const disconnectUserCallback = userId => {
    return () => {
        const user = userleave(userId);
        io.emit('userdisconnected',user)
        delete waitingForDisconnectCheck[userId]
    }
}

socket.on('disconnect', () => {
  waitingForDisconnectCheck[socket.id] = setTimeout(disconnectUserCallback(socket.id), 3000);
})

socket.on('connect', () => {
    waitingForDisconnectCheck[socket.id].clearTimeout()
    delete waitingForDisconnectCheck[userId]
})

基本上当一个套接字断开连接时，你将相关用户放入等待列表中，当3s过去时，它会发出断开连接信号并将自己从列表中删除，如果用户在超时之前重新连接，则超时被清除并且用户已从等候名单中移除。

注意：仅当 socket.id 在重新连接时保持不变时才有效，否则，找到一种方法在重新连接时识别用户。

每次用户刷新时聊天显示用户断开连接

Chat displays that user disconnects every time user refreshes

javascript

chat

socket.io