У меня есть приложение reactjs с сервером nestjs + graphql + subscription.
Я успешно настроил подписку graphql + на сервере. Я могу проверить это через интерактивный интерфейс игровой площадки. Все отлично работает на стороне сервера.
Теперь я пытался настроить подписку graphql на клиенте безуспешно. Я посмотрел на бесчисленные учебники и аналогичные (или даже те же) проблемы GitHub. Вот мои настройки клиента.
Я не знаю, что я делаю неправильно:
import React from 'react';
import { ApolloProvider } from '@apollo/react-hooks';
import { ApolloClient } from 'apollo-client';
import { getMainDefinition } from 'apollo-utilities';
import { split } from 'apollo-link';
import { HttpLink } from 'apollo-link-http';
import { WebSocketLink } from 'apollo-link-ws';
import { IntrospectionFragmentMatcher, InMemoryCache } from 'apollo-cache-inmemory';
// this is a factory function I'm using to create a wrapper for the whole application
const ApolloProviderFactory = (props) => {
const { graphQlUrl, introspectData } = props;
const httpLink = new HttpLink({
uri:`http://${graphQlUrl}`,
});
const wsLink = new WebSocketLink({
uri: `ws://${graphQlUrl}`,
options: {
reconnect: true,
},
});
const link = split(
({ query }) => {
const definition = getMainDefinition(query);
return (
definition.kind === 'OperationDefinition'
&& definition.operation === 'subscription'
);
},
wsLink,
httpLink,
);
const fragmentMatcher = new IntrospectionFragmentMatcher({
introspectionQueryResultData: introspectData,
});
const cache = new InMemoryCache({ fragmentMatcher });
const client = new ApolloClient({
link,
cache,
});
// this component will wrap the whole application
const ApolloWrapper = ({ children }: ApolloWrapperProps) => (
<ApolloProvider client={client}>{children}</ApolloProvider>
);
return ApolloWrapper;
}
Вот ошибка, которую я получаю при запуске приложения:
Любая помощь будет принята с благодарностью.