如何处理这种典型的 WebSocket 使用案例？答案

【问题标题】：How to handle this typical case of WebSocket usage?如何处理这种典型的 WebSocket 使用案例？
【发布时间】：2014-04-13 16:34:25
【问题描述】：

我写了一个网页，其中有一个用户 cmets 的区域。
任何经过身份验证的用户都可以发表评论。

由于许多用户几乎可以同时发布 cmets，我希望 cmets 列表能够自动刷新。因此，我考虑使用 WebSockets。

我的想法是关于这个用例的一个好的/最佳实践：

一旦发表评论，WebSockets 进程是否应该读取数据库中的当前 cmets 列表并发送包含所有新 cmets 的 Json 响应？这将允许客户端直接在 DOM (JS) 上附加新的 cmets。
或者 WebSocket 是否应该只检查数据库（或队列，如果使用消息队列（例如 Redis、RabbitMQ 等））并表现得就像：“嘿，我有新的 cmets，如果你想查看它们，请单击此处！”。此解决方案只会发出新 cmets 存在的信号，而不会将所有这些 cmets 带到客户端。检索事件的工作流将由客户端参与（例如通过单击此句子），例如使用传统的 Ajax 方向：客户端 => 服务器。
用户很可能发表评论，然后导航到网站的另一个页面。因此，包含全新 cmets 的 websocket 响应将毫无用处。一个简单的通知将成为可能，因为大多数已知网站都使用“+1”计数器或与“cmets”场景更相关：“1 个新评论可用”。

我应该选择哪种方式？

【问题讨论】：

【解决方案1】：

我认为决定推送哪些数据主要取决于 UI 可用性/用户体验，而不是使用哪种技术与服务器交互。我们应该避免使用服务器推送的数据更改 UI，以使用户以负面的方式感到惊讶，例如在没有用户干预的情况下让评论源不断增长。

但在实时图表的情况下，最好将数据直接推送到图表中，这正是用户所期望的。

在评论提要的情况下，大多数网站采用“点击加载”方法的原因是因为用户体验，所以我认为这可能是最好的方法。

【讨论】：

对，这是个好方法。实际上，这就是 Stackoverflow 的工作方式，当存在新的 cmets 或答案时，页面会在灰色块中显示一个小链接，上面写着“新 cmets，单击以加载”之类的内容。当页面在没有用户交互的情况下开始增长时，非常烦人。

【解决方案2】：

我将两者结合使用....

在某些页面中，websocket 通信包含实际数据——有点像股票行情更新。

在其他情况下，websocket 通信只是说——所有查看 xyz 数据的用户——刷新它。然后浏览器执行 ajax 来获取新数据，并以这样的方式智能刷新网格，即使用 innerHTML 在屏幕上仅修改更改的单元格，并添加新行并删除删除的行。

在像 stackoverflow 这样的情况下，显示一条消息是有意义的，“有新东西要展示——想看吗？”

当我在浏览器中建立 websocket 时，我在 url 中传递了一个页面 ID，cookie 也被传递了。所以websocket服务器知道——用户cookie和正在查看的页面。

然后在数据库（或中间层逻辑）中与 websocket 服务器通信，消息如下：此消息适用于查看“xyz”页面的用户：智能刷新网格“abc”。并且 websocket 服务器广播消息。

因为协议允许你传递任何你喜欢的东西，所以你可以随心所欲地制作它。

我建议它在每种特定情况下都做最好的事情。

【讨论】：