websocket做的聊天室,本地消息记录的缓存该如何实现呢

Question

vue+websocket+oss做的一个聊天室
要求缓存消息记录
程序有个消息对象msgArr = []
1：是每次退出程序的时候将msgArr转存入localStage还是每次一来消息就存一遍localStage呢
2：如果是图片或者音频视频，该如何存入这个localStage呢，因为localStage的存储空间有限。

Answer 1

聊天记录应该以日志的形式进行缓存，也就是每到一条记录都应该同步到缓存中去，具体的实施方式可以在前端写一个中间件，拿到消息后先入日志，往下进入应用，这样在记录丢失的时候也好定位是socket通信出问题了还是渲染出了问题。

若是退出时才进行缓存，一些丢包现象则很难定位错误节点。

至于图片和音频，如果一定要在前端存储，那么尝试 indexDB 是一个合适一些的选择。不过私以为对于体量大的文件在拿到消息以后的清洗阶段（把取到的数据格式化一下是个好习惯，当然极简的返回数据可能不需要）可以打上标记，然后读取该条缓存的时候数据从服务器上拿。

Answer 2

indexedDB

不知道题主关注过这个没有
可以去看下，尝试使用

回到问题本身，不清楚应用场景。
假设基于浏览器，想存储大量数据本身就是伪命题。
那么如果不是，后端生成聊天记录文件岂不是更好

补充：我自己练手的聊天室用的localStage

Answer 3

可以参考其他的即时通讯软件（QQ、微信、等等），聊天内容缓存在客户端必然会随着时间的增长而变得非常大。所以应该考虑缓存在用户本地磁盘内。但是如果是浏览器只能通过 localstorage 或者其他浏览器提供的方式。但是其实并不适合。