Я работаю над проектом, используя Next.js / Apollo / GraphQL. Я пытаюсь настроить клиент Apollo для использования подписок GraphQL.
Вот код, который у меня есть:
import withApollo from "next-with-apollo";
import ApolloClient from "apollo-client";
import { InMemoryCache } from 'apollo-boost';
import { ApolloProvider } from "@apollo/react-hooks";
import Cookie from "js-cookie";
import cookies from "next-cookies";
import DashNav from "../components/Layout/DashNav";
import { split } from 'apollo-link';
import { HttpLink } from 'apollo-link-http';
import { WebSocketLink } from 'apollo-link-ws';
import { getMainDefinition } from 'apollo-utilities';
import Websocket from 'isomorphic-ws';
const DashState = {
lowerNav: "journal",
searchResults: "",
logType: "daily",
mealType: "breakfast",
nutritionInfo: "",
};
const httpLink = new HttpLink({
uri: 'https://labspt7-nutrition-tracker-be.herokuapp.com'
})
const wsLink = process.browser ? new WebSocketLink({
uri: 'wss://localhost:5000/',
options: {
reconnect: true
},
webSocketImpl: Websocket
}) : null
const link = process.browser ? split(
// split based on operation type
({ query }) => {
const definition = getMainDefinition(query);
return (
definition.kind === 'OperationDefinition' &&
definition.operation === 'subscription'
);
},
wsLink,
httpLink,
) : httpLink;
export default withApollo(
({ initialState, headers, ctx }) => {
let authToken;
if (ctx) {
const { token } = cookies("token");
authToken = token;
} else {
authToken = Cookie.get("token");
}
let token = Cookie.get("token");
return new ApolloClient({
link: link,
cache: new InMemoryCache().restore(
{
...initialState,
lowerNav: "journal",
searchResults: "",
logType: "daily",
mealType: "breakfast",
nutritionInfo: "",
activeCat: "featured"
} || {
lowerNav: "journal",
searchResults: "",
logType: "daily",
mealType: "breakfast",
nutritionInfo: "",
activeCat: "featured"
}
),
headers: {
...headers,
authorization: authToken ? `Bearer ${authToken}` : "",
},
credentials: "include",
resolvers: {},
});
},
{
render: ({ Page, props }) => {
return (
<ApolloProvider client={props.apollo}>
<Page {...props} />
</ApolloProvider>
);
},
}
);
Проблема в том, что веб-сокет закрывается до установления соединения. Похоже на полуизвестную проблему. Кажется, проблема с библиотекой зависимостей subscriptions-transport-ws
. Это зависимость apollo-link-ws
.
Есть другие люди, имеющие проблему здесь:
Но я не вижу, как я могу решить проблему из информации там.
Я пытался использовать библиотеку isomorphi c -ws вместе с атрибутом webSocketImpl
вместо подписок по умолчанию-transport-ws, но это тоже не решило проблему.
Может ли кто-нибудь указать мне правильное направление? Есть что-то простое, что мне не хватает? Любая помощь будет принята с благодарностью.