我们有一个 React 应用程序,它使用 REST 来获取和更新数据,并使用 Websocket 来接收更改通知。
假设我们有一个集合/用户
- user1调用http方法POST/users创建新用户
- user1 收到肯定的 http 响应,创建的用户被添加到 UI 列表中。
- user1 还收到 Websocket 通知“user:created”并再次尝试将新项目添加到 UI 列表。
因此,由于 HTTP 响应和 WS 事件,进行调用的用户应该对结果进行两次处理。这就是我要解决的问题。
一些可能的解决方案: 1. 为调用 POST/users 的用户跳过 WS 事件。他可能有几个打开的浏览器选项卡的问题。并且所有这些都不会更新。 2、不处理HTTP响应,只处理WS事件。
有人遇到过这样的问题吗?还有哪些可用的解决方案?
最佳答案
您基本上已经指出了最佳解决方案 (2.),但这里有一些选项
- 不要使用来自 POST 的响应,而是等待“user:created”事件为所有订阅的客户端(包括启动 POST 的客户端)更新列表 - 建议的方法
- 使用您当前的实现,但您的 POST 和“user:created”事件应该共享某种标识符,它们与请求的其余部分一起返回,客户端可以使用该标识符来确定他是否已经获得该信息 - 例如“用户:创建:{userId}”。然后只有内存中没有“user:created:{userId}”的客户端才会使用 WS 事件数据。 - 不推荐
- 为启动 POST 的用户跳过 WS 事件 - 如果特定用户连接了多个客户端(选项卡、浏览器 + 移动设备等),问题在于 - 使用这种方法,您必须跳过客户端的 WS 事件(connectionId在套接字术语中)发起 POST 请求(不是用户!)。因此,如果用户有 10 个连接,您会将“user:created”事件发送到 9 个连接,除了发起请求的连接 + 所有其他应该接收该事件的连接 - 不推荐,因为它会使您的后端复杂化很多。
在我看来,最简单和最干净的方法是忽略 POST 响应并等待该 WS 事件 - 因为这些是套接字,所以您不应该有任何 UI 问题或延迟。
关于reactjs - 如何忽略通过 HTTP 进行更改的客户端的 websocket 事件?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/58015819/