Javascript Apollo订阅-使用subscribeToMore处理WS-Disconnect

我一直在寻找一种方法来处理Apollo订阅的React应用程序中的web套接字断开连接，但还没有找到这样做的方法。我在apollo文档中看到的其他示例显示了以下捕获重新连接的方法：

  const wsClient = process.browser ? new SubscriptionClient(WSendpoint, {
    reconnect: true,
  }) : null;

  const wsLink = process.browser ? new WebSocketLink(wsClient) : null;

  if (process.browser) {
    wsLink.subscriptionClient.on(
      'reconnected',
      () => {
        console.log('reconnected')
      },
    )
  }

上述方法存在两个问题：

当用户从他们的internet断开连接时（仅当服务器出于任何原因重新启动时），这是不会被捕获的

重新连接是在my React apps组件之外触发的 我希望能够做到的是，如果用户断开与internet的连接，或者如果我的express服务器因任何原因停机，则重新加载我的“聊天”组件。为了实现这一点，我需要完全重新加载聊天组件，我不确定是否可以从组件树之外重新加载

---

在阿波罗组件的

查询

或

订阅

中是否有一种方法能够捕获此事件并从组件中相应地处理它？

我可以想到几种方法来处理这些情况，但它们都不是一次性解决方案，每个情况都需要独立处理

设置

在线/离线
侦听器（）

设置阿波罗中间件来处理来自服务器的网络错误（）

例如，在应用商店中创建一个变量，

isOnline

，它可以保存应用程序状态的全局引用。无论何时触发上述两种方法，都可以更新

isOnline

最后，将所有这些信息捆绑在一起。创建一个react，它使用

isOnline

来处理每个组件的网络状态。这可用于处理网络错误消息，在网络恢复后刷新组件

---

您可以使用来自

subscriptions-transport-ws

的

SubscriptionClient

回调，如下所示：

const-ws=require（“ws”）；
const{SubscriptionClient}=require（“订阅传输ws”）；
const{WebSocketLink}=require（“阿波罗链接ws”）；
const{apollo客户端}=require（“apollo客户端”）；
const{InMemoryCache}=require（“apollo缓存inmemory”）；
const subClient=新订阅客户端(
'ws://localhost:4000/graphql'，
{重新连接：true}，
ws
);
子客户端onConnected（（）=>{console.log（“onConnected”）}）；
子客户端.onReconnected（（）=>{console.log（“onReconnected”）}）；
子客户端.onReconnecting（（）=>{console.log（“onReconnecting”）}）；
子客户端onDisconnected（（）=>{console.log（“onDisconnected”）}）；
subClient.onError（error=>{console.log（“onError”，error.message）}）；
const wsLink=新的WebSocketLink（子客户端）；
const客户端=新客户端({
链接：wsLink，
缓存：新的InMemoryCache（）
});

我在Node.js中使用它，但它可能也适用于React