请问聊天场景里，前端如何替换快速发送的多条消息？

我也没做过，但是如果我做，我会前端对每条待发送的消息生成一个前端 id ，随消息内容一起发送给后端，后端在接收后，把前端 id 、后端 id 、消息体一起响应给前端，前端就能对应上并更新了

前端是永久视图，响应成功后只需要改变消息状态从发送中改为发送成功
数据结构不需要完全由服务器创建，服务器只负责创建 id ，其他跟客户端完全一样
当然客户端需要生成一个客户端 id 作为消息唯一标识
所以没有所谓数据对齐的问题
消息的顺序符合因果一致性就可以了

数据结构里消息体是前端和服务端一致的，只有状态和 ID 是服务端给的

也就是说前端可以不用等服务端响应就直接可以更新视图

你可以仔细观察一下，QQ 和微信等发送失败、或者被拉黑的场景，也是先更新了视图，然后服务端响应或者超时之后，才会增加发送失败的标记

我司是这么做的：通过 IM SDK 创建一条消息，调用发送会返回一个 Promise 。Promise.then 里面会有消息内容，通过 id 找到客户端创建的消息，然后用服务端返回的直接替换掉

没有强制顺序的，有时候你看微信电脑端和手机端的聊天记录顺序还有不一样的，按前端顺序展示即可，后加载的按服务端顺序。

先把需要处理的情况，全部罗列出来，然后挨个处理就行，举个简单例子：

1.当用户在前端，比如网页版群聊，发送一条消息时，该消息立即被渲染在前端页面，接着开始处理消息发送逻辑，同时在页面上显示该消息的状态。状态示例：
状态 1：正在发送到后端
状态 2：发送到后端失败，失败原因：XXXXX
状态 3：后端已收到数据，后端正在处理
状态 4：消息成功发送（后端处理完毕）
每种状态有自己的图标。

2.发送频率太快，则该该消息显示为状态 2：发送到后端失败，失败原因为发送频率太快。

3.网络中断，或后端服务未启动，则该消息显示为状态 2：发送到后端失败，失败原因为网络问题或后端服务未响应。

4.后端已经收到数据，后端开始处理，则该消息显示为状态 3：后端已收到数据，后端正在处理。

5.后端回复说数据处理完毕，则该消息显示为状态 4：消息成功发送（后端处理完毕）。

虽然没写过，但是感觉这是乐观更新的经典场景了

网卡的时候 QQ 很明显并不是真实顺序
尤其有图视频的情况下
刷新下重进就变了