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

大家真想解决这个问题的话，真的可以看一下，我的经验所获，绝对可以用。
不过小白可能看不懂，最好知道什么是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){//保存客户端的socketconst _id = socket.handshake.query.userIdsocketSet[_id] = socketsocketSet_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

使用socket解决，网页应用监控用户唯一在线相关推荐

网页前端监控系统（错误日志，接口监控）的使用
网页前端监控系统(错误日志,接口监控)的使用开门见山地说当程序员开发网页达到一定的量级,用户的数量达到一个比较庞大的数量时,总会遇见一些怎么测试都无法复现的bug,但是用户操作的时候却能屡次碰到, ...
java毕业设计——基于java+Socket+sqlserver的远程监控系统软件设计与实现（毕业论文+程序源码）——远程监控系统
基于java+Socket+sqlserver的远程监控系统软件设计与实现(毕业论文+程序源码) 大家好,今天给大家介绍基于java+Socket+sqlserver的远程监控系统软件设计与实现,文章 ...
Python:通过远程监控用户输入来获取淘宝账号和密码的实验（二）
从今天早上产生了写个获取淘宝账号及密码的想法后,到现在,全天都在看书.调试程序,12小时内写了三篇相关博客,如下: <Python:通过获取淘宝账号和密码的实验,来看登陆方式选择的重要性> ...
支付宝网页授权获取用户信息
****** 支付宝网页授权获取用户信息(昵称,头像等)****** 最近有个项目需要获取到支付宝的头像和昵称作为互动数据,作为php新人,对于看文档来说很是痛苦,网上也没有很多关于支付宝网页 ...
微信开发网页授权获取用户基本信息
微信公众平台最近新推出微信认证,认证后可以获得高级接口权限,其中一个是OAuth2.0网页授权,很多朋友在使用这个的时候失败了或者无法理解其内容,希望我出个教程详细讲解一下,于是便有了这篇文章. 一. ...
公众号openid实时存储mysql_微信--高效解决token及授权用户openid的持久化处理办法...
摘要关于微信开发的话题,例子确实已经有不少,但大部分都是人云亦云,很多小细节或者需要注意的地方却大多没有讲清楚,这令很多刚开始开发的人感觉大很迷茫.而我今天要说的话题,主要着眼于两个方面. 一:如何 ...
第八篇：微信公众平台开发实战Java版之如何网页授权获取用户基本信息
第一部分:微信授权获取基本信息的介绍我们首先来看看官方的文档怎么说: 如果用户在微信客户端中访问第三方网页,公众号可以通过微信网页授权机制,来获取用户基本信息,进而实现业务逻辑. 关于网页授权回调域 ...
Spring Boot 微信-网页授权获取用户信息
微信-验证服务器有效性微信-网页授权获取用户信息网页授权获取用户信息步骤第一步:用户同意授权,获取code 第二步:通过code换取网页授权access_token 第三步:拉取用户信息(需sc ...
微信开发网页授权获取用户信息
如果用户在微信客户端中访问第三方网页,公众号可以通过微信网页授权机制,来获取用户基本信息,进而实现业务逻辑. 1. 关于OAuth2.0的说明官方网站:http://oauth.net/ htt ...

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

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

后端：

使用socket解决，网页应用监控用户唯一在线相关推荐

最新文章

热门文章