使用socket解决,网页应用监控用户唯一在线

在这里我提供一种思路,因为考研原因,没有整理很详细的代码,希望大家谅解。

大家 真想解决这个问题的话,真的可以看一下,我的经验所获,绝对可以用。
不过小白可能看不懂,最好知道什么是Websocket,再懂一点点js代码就可以。

我们通常想的是,在数据库中增加两个字段,一是当前是否在线,二是在线过期时间,不过,如果只依靠数据库,是很难解决当用户直接关闭浏览器这一行为。我们无法准确监控这一行为。这也是网页应用中监控用户在线状态的一个最大的难点。

不过我们可以想到用ajax轮询的方式,如果超过xx秒没有发送轮询请求,就判定用户已经关闭浏览器,这样也是可以的,不过可能会有比较大的误差。

在这里我分享一个我发现的方法,亲测可用,如果是有实时聊天,弹幕等功能的项目,更是好用。就是使用WebSocket。

不但可以实时监控用户在线状态,防止同账户多地登录,还能使用socket的聊天等功能。

我下面的代码后端是node + express,前端是React的SPA,不过思路都是一致的。

首先,我们先建立socketIO连接。
前端代码不详细写了:注意这个:ws://localhost:4000/?userId=xxx连接ws时,把用户在前端的唯一标识(如主键,id号等)传到后端的socket,下面我都叫它主键。
最重要的一点,把socketSet要设置成全局变量,至少在登录和注册等模块可以使用。

后端:

结合我的解释看代码,socketSet是一个对象,里面属性名是用户主键,取出作为参数的主键:socket.handshake.query.userId,属性值是连接产生的socket对象。
而socketSet_ids也是一个对象集合,属性名是 socket.id ,属性值是userId(刚才传过来的主键)。

let socketSet = {
    
    }  //结构:{userId: socket, ......}
// 方便用户直接关闭浏览器,即突然断开socket连接时,有效删除Set中的socket
let socketSet_ids={
    
    }  //结构:{socket.id: userId, ......}  

exports.socketIO = function (server) {
    
    
    //得到IO对象
    const io = require("socket.io")(server)
    //监听连接(当有一个客户连接上时,后面的函数就会回调)
    io.on("connection", function(socket){
    
    
        //保存客户端的socket
        const _id = socket.handshake.query.userId
        socketSet[_id] = socket
        socketSet_ids[socket.id] = _id
        
        
        //接收客户端发送的消息,from是谁发,to是发给谁,content是内容
        socket.on("sendMsg", function({
    
    from, to, content}){
    
    
            .....
            .....
                if(socketSet[to]) {
    
    
                    console.log("对方在线消息发送:::")
                    socketSet[to].emit("receiveMsg", chatMsg)
                }
                socketSet[from].emit("receiveMsg", chatMsg)
            })
        })

    # 断开连接时的操作
        socket.on("disconnect", function(){
    
    
        ## 这样 的数据结构能快速删除指定socket,不用再遍历。
           delete socketSet[socketSet_ids[socket.id]]
        })
    })
}

//暴露出去,在用户退出登录时,移除指定元素
exports.socketSet=socketSet

这样我们就可以在用户登录或者是自动登录时,先获取到socketSet,再通过传递主键,来判断socketSet中是否有对应的属性值,如果有值,说明用户在线,如果没有值,说明用户没有在线,可以覆盖登录。

socketSet这样的数据结构有什么好处?
第一,就算不是SPA应用,也可以使用,在用户访问的每个页面建立WebSocket的连接,而不会socketSet中不会出现两个相同的socket对象。如果后台应用是java,则可以使用List类型来替代我的socketSet集合。
第二,通过socketSet的属性名是所谓的主键,前端用户的唯一标识,能快速对该对象集合进行操作(如删除)。
第三,用户退出登录操作时,也可以调用socketSet,删除其中对应主键的值。

socketSet_ids这样的数据结构有什么好处?
它没必要是全局变量,只要可以在关闭连接这个事件监听中可以使用即可。关闭socket时,我们什么都得不到,只能使用连接产生的socket对象,所以可以通过这个socket对象的唯一标识,快速查到对应的userId(主键),然后能删除socketSet中的对应值。

有什么看不懂的,或者有更好的思路的前辈,还可以联系我,qq: 1919213538

猜你喜欢

转载自blog.csdn.net/qq_42458992/article/details/104480798
今日推荐