使用来自 apollo-link-ws 的 WebSocketLink 检查互联网连接

Posted 2023-03-08

【中文标题】使用来自 apollo-link-ws 的 WebSocketLink 检查互联网连接

【英文标题】：check for internet connectivity using WebSocketLink from apollo-link-ws

【发布时间】：2018-11-26 00:29:12

【问题描述】：

我正在尝试使用 apollo websockets 检查互联网连接，其目的是在没有连接时显示“您已断开连接”消息，以防止用户输入并假设更改已保存（更改应该保存在类型上），这是 apollo-link-ws 设置的一部分

const wsLink = new WebSocketLink(
uri: `ws://$hostname$port ? `:$port` : ''/subscriptions`,
options: 
 reconnect: true,
 connectionParams: () => (
  authorization: localStorage.getItem('accelerator-token')
 )

);

和

    const hasSubscriptionOperation = ( query:  definitions  ) =>
    definitions.some(
    ( kind, operation ) =>
      kind === 'OperationDefinition' && operation === 'subscription'
  );

这是客户端配置：

const client = new ApolloClient(
link: ApolloLink.split(
    hasSubscriptionOperation,
    wsLink,
    ApolloLink.from([
      cleanTypenameLink,
      authMiddleware,
      errorLink,
      stateLink,
      createUploadLink()
    ])
  ),
  cache
);

【问题讨论】：

还有其他方法可以实现吗？ （不使用ws）

【参考方案1】：

经过一番搜索，我发现我可以使用subscriptions-transport-ws 中的SubscriptionClient

export const myClient = new SubscriptionClient(`ws://$hostname$port ? 
`:$port` : ''/subscriptions`, 
 reconnect: true,
 connectionParams: () => (
  authorization: localStorage.getItem('accelerator-token')
 )
);
myClient.onConnected(()=>console.log("connected f client f onConnected"))
    myClient.onReconnected(()=>console.log("connected f client f 
reconnected"))
myClient.onReconnecting(()=>console.log("connected f client  f 
reconnecting"))
myClient.onDisconnected(()=>console.log("connected f client  f 
onDisconnected"))
myClient.onError(()=>console.log("connected f client  f onError"))
export const wsLink = new WebSocketLink(myClient);

这些方法可以用来检测网络状态

【讨论】：

onConnected 从不为我开火。适合你吗？

【参考方案2】：

如果你正在使用 React，我发现了这个不错的社区包 react-apollo-network-status