Web聊天室消息[已读未读]的实现

app里未读消息已读、未读是怎么设计的? 一款app,消息页面有:钱包通知、最近访客等各种通知类别,每个类别可能有新的通知消息,实现已读、未读功能,包括多少个未读,这个是怎么实现的呢?比如用户A访问了用户B的主页,难道用rabitmq给B发通知消息吗?量大了成本受得了吗?有没有成本低的方案呢 阅读详情

聊天室快速访问
继上次完成聊天室的历史记录功能后,我又想着实现聊天记录的已读未读功能。(轻喷。。)

开始之前

首先我看了抖音和钉钉这两款应用的消息已读未读功能的呈现效果。首先是抖音,在聊天界面,给好友发送完消息后,消息界面的最右下角有一个“已发送”标记,这时候是属于对方未读,如果对方上线并别点开了和你的聊天界面,你和他的聊天界面上,那个“已发送”就变成了“已读”,所以抖音并不会每一条消息上面都显示“已读”或者“未读”。而钉钉,由于其专注于办公,这个已读未读功能就“变态”多了,每一条发出去的消息都会显示对方是已读还是未读。

学谁?

当然了,我只能通过抖音或者钉钉在功能上呈现出来的效果来结合自己掌握的知识来推断他们大概的实现过程,真正的实现可比想的复杂多了,所以我也是照葫芦画瓢,做一个能用的精简版已读未读功能。既然是照葫芦画瓢,那就学钉钉吧,做一个“变态版”,每一条消息都显示“已读”或者“未读”。

思考

A和B聊天,如果A发送一条消息给B,怎么知道B已读呢?当然是B收到消息后,发送一个“已读回执”,A接收到已读回执后,更新自己的UI,把“未读”改为“已读”。

啊!挺简单啊。。。

可,,可是,如果B不在线,或者B在线,但是没有打开和A的聊天界面,那B不也是未读A的消息吗?如果B不在线,A发完消息后下线了,这时B上线了,查看消息后,发送已读回执给A,可是A已经下线了啊,怎么保持已读状态?此外,消息的已读和未读状态要保持的话,是该给消息添加一个属性,标识已读未读吗?如果添加属性,意味着我以前的代码也得改?比如一些操作数据库的代码和逻辑。

啊!

我怎么做

首先,并不需要给消息添加一个已读未读标识,只记录一个B最近已读A消息的时间即可。这样怎么就行呢?

1.

面试官:群聊消息的已读未读功能,你来设计一个? 一朋友和我讨论他前段时间面试某大公司的一题目 : 企业IM比如企业微信、钉钉里面的群消息的有个已读未读的功能,发送者刚发出消息时,当前群里其他群成员都是未读状态,陆陆续续有人看了这个消息,这时候消息的详情变成x人已读,y人未读,如下图所示,有具体的已读未读列表(万恶的功能,看到同事or老板的消息不能假装没看到了),每条消息对应一个唯一的messageid(uint64_t),每个用户对应一个唯一的userid(uint64_t),应该如何保存这个消息对应的已读未读详情呢? 图片 我第一时间给出 阅读详情

相关推荐

socket未读消息 如何设计_消息未读之点不完的小红点设计思路(Node+Websocket)

前言https://github.com/hua1995116/webchat这个项目本来是我学生时代为了找工作的一个练手项目,但是没想到受到了很多的关注,star也快要破K了,这也激励着我不断去完善他,一方面是得对得起关注学习的人,另一方面也是想让自己能过通过慢慢完善一个项目来让自己提高。今天给大家带来的是基于Websocket+Node+Redis未读消息功能,可能更加偏向于实战方向...

weixin_36087674的博客 1176

web开发之即时通讯数据库设计

很多web应用带有站内信的功能,或者类似于新浪微博一样的聊天功能,这篇文章针对即时通讯的数据库设计发表一下自己的看法。 首先说一下需求:设计一个IM系统,实现私信聊天,群聊功能,并可以发送图片或者其他附件。 设计思路:把开始一个聊天会话想象成开一个聊天室,如果是私信聊天,那么这个聊天室里面就只有两个人,如果是群聊,那么这个聊天室就有多个人。这个过程中涉及到的三个实体,聊天室,参

Jahnng的专栏 1万+

从零搭建PHP聊天室:ChatNet源码部署、数据库设计与私聊二次开发实战

聊天室系统是Web开发中的经典应用场景,其核心在于如何用PHP与MySQL构建实时互动的消息收发机制。部署一套聊天室源码,不仅涉及Web服务器环境选型、PHP扩展配置、数据库字符集设计,还需要理解公共房间与私聊消息的底层数据表结构。本文从技术原理出发,先厘清环境部署与数据库连接的基本要点,再深入消息表的字段设计、增量轮询拉取策略及在线状态维护,最后结合完整汉化版ChatNet V1.11源码,演示如何实现导航栏未读提醒、已读回执等二次开发需求。无论你是站长、企业内部工具开发者,还是想快速搭建临时活动聊天页的

weixin_27960253的博客 331

仿微信H5聊天室源码:多人群聊与搭建教程

WebSocket长连接是实现实时通信的核心技术,通过一次握手建立双向通道,服务端可主动推送消息,显著降低延迟与服务器压力。在IM系统中,它支撑多人群聊、在线状态维护和离线消息拉取,广泛应用于客服、社交及内部协作场景。结合仿微信界面与移动端键盘适配,一套完整的H5聊天室源码能快速落地。本文分享的源码支持多人群聊与交友,自带搭建教程,前后端齐全,适合中小团队快速验证产品。

weixin_33971721的博客 119

用豆包+Skill从零制作AI漫剧:分镜、画面、配音到成片全流程

AI漫剧作为一种新兴内容形态,结合AI绘画与AI视频生成技术,正在改变短视频创作方式。其核心原理是利用提示词工程,将创意转化为结构化分镜脚本,再通过豆包等AI助手的Skill能力,将重复的脚本生成和分镜拆解流程固化为可复用的指令模板,从而大幅降低从构思到成品的生产门槛。这种模式无需剧组、演员和实景拍摄,让个人创作者也能借助图像生成、TTS配音与剪辑合成工具,批量化地生产剧情短片,适用于短视频平台连载、商业定制与个人IP打造。围绕豆包+Skill这条主线,从选题、剧本写作、分镜表设计,到画面提示词生成、视频片

weixin_29048309的博客 1484

西门子 S7-200 SMART 系列六:手把手教你配置S7-200 SMART Modbus RTU

最新发表:https://www.ics-pedia.com/%e8%a5%bf%e9%97%a8%e5%ad%90-s7-200-smart-%e7%b3%bb%e5%88%97%e5%85%ad%ef%bc%9a%e6%89%8b%e6%8a%8a%e6%89%8b%e6%95%99%e4%bd%a0%e9%85%8d%e7%bd%aes7-200-smart-modbus-rtu%e5%ae%9e%e4%be%8b/

John_09040211的博客 3279

手把手教你用STM32CubeMX和HAL库驱动MT6835磁编码器(SPI读取21位角度)

本文详细介绍了如何使用STM32CubeMX和HAL库驱动MT6835磁编码器,通过SPI接口读取21位高精度角度数据。从硬件准备、CubeMX配置到HAL库驱动实现与优化,提供了完整的实战指南,帮助开发者快速掌握磁编码器的应用技巧,适用于机器人关节和精密仪器等高精度场景。

weixin_28716769的博客 439

巧妙解决网页弹窗重复出现问题

本文探讨了网页弹窗关闭后刷新重现的问题及解决方案。通过分析原生JavaScript实现的弹窗代码存在的缺陷,提出了使用jQuery改进的方法。关键点包括:利用event.preventDefault()阻止默认行为避免刷新,采用jQuery的hide("slow")方法实现优雅的关闭动画,确保关闭状态持久化。改进后的方案既解决了弹窗重复出现的问题,又提升了用户体验,为网页弹窗交互提供了更优的实现方式。文中提供了完整的HTML、CSS和JavaScript代码示例,便于开发者直接应用。

2501_90323865的博客 180

【安全机制分析案例】从PDF预览页面提取原始PDF文件的方法原理与实践 篇二:基于致远互联(Seeyon)封装的SuwellLightRead技术

该HTML代码片段展示了致远OA协同办公系统的前端页面结构,包含多个CSS样式表和JavaScript文件的引用。页面设置了IE兼容模式,加载了全局环境变量、UI组件库和公告模块相关资源。代码中定义了系统路径、静态资源后缀等全局变量,并包含公告查看功能的相关配置参数。页面还引用了水印、文档处理、即时通讯等功能的JS文件,并设置了文件下载框架。整体呈现了一个典型的OA系统前端实现方案,包含浏览器兼容处理、资源加载和功能模块初始化等逻辑。

生活在别处 2072

小米汽车车载多摄像头视频链路深度解析 | MAX96792/MAX96724/MAX96781 实战分享

通过合理的输入输出规划 + 虚拟通道管理 + 加串行策略,可以在成本和性能之间取得最佳平衡,这就是多摄像头系统设计的核心精髓。

weixin_43199439的博客 1547

【原创】汇川H5U PLC控制伺服的方法

6、在线调试-进入伺服调试,可以在本软件上进行调试,可以实现原点回归、正向点动、反向电动、使能(这里使能打开时触摸屏上的使能不能打开,会冲突)、复位、停止(如下图所示)。5、在原点返回设置中一般情况下对原点信号、正限位、负限位、原点返回方向、原点返回方式进行设置,其他设置默认不改(如下图所示)。3、在单位换算设置上只需要修改脉冲数和移动量(根据伺服配套导轨上名牌进行设置),其他设置默认不改(如下图所示)。11、双击后右边出现编辑框 在上半部分定义变量(IN、INOUT、OUT、VAR)(如下图所示)。

Qinmingyue13的博客 6662

彻底讲透 SAP 中的 client-safe:从 CDS、AMDP 到 ABAP Cloud 的客户端隔离设计

SAP系统中的client-safe概念定义了技术边界:访问client-dependent数据的对象必须确保只看到单个client数据,而访问client-independent数据的对象则天然满足条件。这一原则直接影响CDS视图、AMDP等核心组件,并与ABAP Cloud开发模型紧密集成。在业务系统中,client isolation要求用户只能看到当前登录client的数据。SAP通过语言版本、对象规则和静态检查强制执行这一约束,特别是在ABAP Cloud开发中,AMDP方法和发布的API必须满足

2007 年 ~ 2025 年,深耕 SAP 技术 18 年 3262

visio安装包

Microsoft Office Visio 是一款专业的制图软件。利用经过更新的形状、协作工具和数据链接图表,创建专业级图表以简化复杂的信息。

Probability and Statistics - 4th edition

Probability and Statistics - 4th edition

SIMATIC S7-1200, S7-1500 PID 控制[手册]

SIMATIC S7-1200, S7-1500 PID 控制[手册]

SAP B1中文培訓教材_SDK

公司内部培训资料,对开发工具 ,DIAPI, UIAPI,Add-ON有详细解说

上一篇: Web聊天室历史记录解决方案(轻喷。。)
下一篇: 【小记】2021秋招总结
皮皮蟹01
博客等级 码龄10年 29粉丝 76原创
评论 8
成就一亿技术人!
拼手气红包6.0元
还能输入1000个字符
 
 条评论被折叠 查看
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付:10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值