apollo-client: TypeError [ERR_INVALID_ARG_TYPE]: The "filename" argument must be of type string or an instance of URL. Received an instance of URL

Issue Description

I’m getting this very weird error trying to use Apollo persisted queries link, as instructed here, and I’m very confused of what it means, since if ‘instance of URL’ is a valid type and that function is receiving it like that, it shouldn’t be a type error.

My client looks like this:

import {
  ApolloClient,
  ApolloLink,
  HttpLink,
  InMemoryCache,
} from "@apollo/client"
import { onError } from "@apollo/client/link/error"
import { createPersistedQueryLink } from "@apollo/client/link/persisted-queries"
import ApolloLinkTimeout from "apollo-link-timeout"
import { sha256 } from "crypto-hash"
import { Agent } from "https"
import { log } from "next-axiom"

const apiUri = process.env.NEXT_PUBLIC_GRAPHQL_API_URL

const httpLink = new HttpLink({
  uri: apiUri,
  fetchOptions: {
    agent: new Agent({ keepAlive: true }),
    next: {
      revalidate: 300,
    },
  },
})

const timeoutLink = new ApolloLinkTimeout(15_000)

const errorLink = onError(({ graphQLErrors, networkError, operation }) => {
  if (graphQLErrors)
    graphQLErrors.forEach(({ message, locations, path }) =>
      log.error(
        `[GraphQL error]: Message: ${message}, Location: ${JSON.stringify(
          locations
        )}, Path: ${path}, operation: ${operation.operationName}`
      )
    )
  if (networkError) {
    if (networkError.message.includes("Timeout exceeded")) {
      log.error(`Timeout exceeded Operation Name: ${operation.operationName}`)
    } else {
      log.error(
        `[Network error]: ${networkError}, operation: ${operation.operationName}`
      )
    }
  }
})

const persistedQueriesLink = createPersistedQueryLink({
  sha256,
  useGETForHashedQueries: true,
})

const links = process.env.VERCEL_ENV
  ? [errorLink, timeoutLink, persistedQueriesLink, httpLink]
  : [errorLink, persistedQueriesLink, httpLink]

export const apolloLink = ApolloLink.from(links)

const isClient = typeof window !== "undefined"

const client = new ApolloClient({
  ssrMode: true,
  link: apolloLink,
  cache: new InMemoryCache(),
  defaultOptions: {
    query: {
      fetchPolicy: isClient ? "cache-first" : "no-cache",
      errorPolicy: "all",
    },
  },
})

export default client

Link to Reproduction

.

Reproduction Steps

No response

@apollo/client version

3.9.1

About this issue

  • Original URL
  • State: closed
  • Created 5 months ago
  • Comments: 17 (10 by maintainers)

Most upvoted comments

Yes! It seems the crypto-hash module wants to do things in a worker process and the Next.js webpack cannot work with that?

For what it’s worth, you don’t need an external package for that, modern node can already do that:

import crypto from "node:crypto";
function sha256(data: string) {
  const hash = crypto.createHash("sha256");
  hash.update(data);
  return hash.digest("hex");
}

Happy to help, I hope you can resolve your other problem, soon, too!

I’ve also answered to your StackOverflow question - maybe the answer there helps someone else in the future 😃

One other thing is that im using the experimental support lib and the link in the description is used with the registerApolloClient function:

import { registerApolloClient } from "@apollo/experimental-nextjs-app-support/rsc"
import client from "@src/lib/apolloClient"

export const { getClient } = registerApolloClient(() => client)

Please never do that!

It’s extremely important that the client instance is created inside the registerApolloClient function - otherwise you will be sharing a client instance between all your users, potentially leaking private data between users. Next.js will keep running between requests and something like a module-global client variable/export would be shared between users.