每次更改多次触发 GraphQl 订阅解析器

Question

使用 GraphQl 订阅时我遇到了一个奇怪的问题。为了实时更新，我在服务器 (NodeJs) 上使用 MongoDB Change Stream 功能，在前端使用 GraphQl 订阅 (Angular)。因此，当数据库中出现一些更改时，它会通过 GraphQl 订阅发送到客户端。在 Angular 组件上，有 GraphQl 订阅实现（使用 Apollo client）：

...
ngOnInit() {
    this.subscribeToApprovedNews(this.params);
}

subscribeToApprovedNews(params) {
  this.newsQuery.subscribeToMore({
      document: addApprovedNews,
      variables: {
        projectId: params
      },
      updateQuery: (previous, { subscriptionData }) => {
        ...
        const newItem = subscriptionData.data['addApprovedNews'];
        console.log(`${params} -> added news -> ${newItem}`);
        ...
      }
  });
}

但是当我们进入这个组件 n 次时，在 数据库中的一次更改 我们从订阅这个 n 次。据我了解，当我们进入组件时，客户端已经建立了新的 WebSocket 连接： "Network" tab of the Chrome developer tools 作为 GraphQL 订阅的传输，我使用 subscriptions-transport-ws 包。

因此，数据库上的一个更改 会触发多个 QraphQl 订阅解析器，因此在客户端我们会收到有关更改的重复通知。如何解决此问题并无论用户输入组件多少次，每个订阅只接收一个数据?

提前致谢！

Answer 1

我认为您应该在离开组件时取消订阅。好的地方是 ngOnDestroy 方法。

每次更改多次触发 GraphQl 订阅解析器

Fire QraphQl subscription resolver multiple times per single change

graphql

graphql-subscriptions

angular