Question

我正在使用React，Apollo和GraphQL构建实时应用程序。我的计划是组件将发出查询，然后依赖订阅来保持客户端缓存与后端数据实时一致。但是，我不相信这会起作用，因为我必须在卸载组件时取消订阅订阅。再次安装组件时，结果将从查询缓存中获取，因此它们实际上会过时，因为订阅关闭后将会错过之间发生的所有更改。再次打开订阅将意味着结果将被搞砸，因为两者之间的更改已被遗漏。

例如，在组件A中，如果我有查询： -

query {
  customers {
    id
    name
    phoneNo
  }
}

和订阅： -

subscription customersUpdated {
  customersUpdated {
    id
    name
    phoneNo
  }
}

第一次安装A时会运行customers查询。结果被缓存。在订阅customersUpdated的帮助下记录对客户数据的所有更改。请注意，订阅不会返回所有客户，只会返回需要合并到查询缓存中的更改。卸载A时，我取消订阅订阅。假设另一个用户对客户数据进行了5次更改，而A保留了当前用户的卸载。再次安装A时，这5个更改已被遗漏，查询只是从缓存中获取结果。订阅再次开始，但现在数据处于不良状态，因为我们已经错过了这5个更改，并且永远不会得到它们！

在这里使用订阅的正确模式是什么？我正在尝试避免使用查询进行基于时间的重新获取，因为我希望应用程序能够实时工作。同时也是实时的，我只想提取更改，而不是不必要地提取所有数据。

Answer 1

您可以做一些事情：

只需在GraphQL查询中使用network-only或cache-and-network获取策略，以便在组件安装时获取最新数据。像往常一样初始化订阅。
在组件卸载时不要停止订阅，并在组件外部处理订阅生命周期。这可能是更多的工作，但是你可以控制它何时开始和停止。

但是，我鼓励您更多地考虑应用的哪些部分实际需要实时。在大多数应用程序中，只有一小部分体验需要具有低延迟数据更新，因此仅在小情况下使用订阅可能是更好的策略。在一天结束时，通常更容易推理无状态架构的扩展。

使用React和Apollo的graphql订阅创建实时应用程序

1 个答案: