可以在创建GraphQL HttpLink时添加一个websocket链接,以便在使用订阅时利用WebSocket。下面是一个示例代码:
import { split, HttpLink } from '@apollo/client';
import { getMainDefinition } from '@apollo/client/utilities';
import { WebSocketLink } from '@apollo/client/link/ws';
const httpLink = new HttpLink({
uri: 'http://localhost:4000/graphql',
});
const wsLink = new WebSocketLink({
uri: 'ws://localhost:4000/graphql',
options: {
reconnect: true
}
});
const splitLink = split(
({ query }) => {
const definition = getMainDefinition(query);
return (
definition.kind === 'OperationDefinition' &&
definition.operation === 'subscription'
);
},
wsLink,
httpLink,
);
const client = new ApolloClient({
link: splitLink,
cache: new InMemoryCache()
});
此代码中,我们使用splitLink
将HTTP链接和WebSocket链接连接在一起。split
函数会检查查询是否属于订阅类型,如果是,则使用WebSocketLink,如果不是,则使用HttpLink。WebSocketLink
中的选项可以被配置,以便在需要时自动重新连接。
如果您已经使用了GraphQL WebSocket链接,但要切换到使用纯HTTP链接,则需要更改服务器端的代码来仅使用HttpLink。