apollo-client-nextjs
apollo-client-nextjs copied to clipboard
Issues with telemetry in client components
Howdy,
My team and I have been using the experimental package for a few months now as we build up our Next.js 14 app. It's been working quite well! However, we recently started to implement telemetry, and have ran into some issues related to the package.
What works
We followed the guide on the blog, and were able to get telemetry working for queries called from the server.
import { ApolloClient, InMemooryCache, from } from "@apollo/client";
import { registerApolloClient } from "@apollo/experimental-nextjs-app-support/rsc";
const { getClient } = registerApolloClient(() => {
return new ApolloClient({
cache: new InMemoryCache(),
link: from([splitLink]),
defaultOptions: {
query: {
fetchPolicy: "no-cache",
},
},
}),
});
As expected, when a query is made using getClient().query
, the query traces show up on the Jaeger UI, and the context progagates properly to the backend service.
What doesn't work
When making queries from the client using useQuery
from the experimental package, the traces do not show up on Jaeger.
function makeClient() {
return new NextSSRApolloClient({
cache: new NextSSRInMemoryCache(),
link:
typeof window === "undefined"
? ApolloLink.from([
new SSRMultipartLink({
stripDefer: true,
}),
splitLink // Chooses between http and websock links (pulled from the apollo docs)
])
: from([splitLink]),
});
}