how using ApolloNextAppProvider with Auth0?

Question

I didn't understand how to add the auth0 token inside the graphql wrapper...
inside withMiddlewareAuthRequired I can get the access token using 'getAccessToken', but inside the wrapper I was unsuccessful

I am using the following packages:
"next": "14.1.4",
"next-apollo": "^5.0.8",
"react": "18.2.0",
"@apollo/client": "^3.9.9",
"@apollo/experimental-nextjs-app-support": "^0.9.1",
"@auth0/nextjs-auth0": "^3.5.0",
"typescript": "5.4.3"

middleware.ts

export default withMiddlewareAuthRequired(async function middleware(req) {
  const res = NextResponse.next();
  const session = await getSession(req, res);
  console.log('session: ', session);
  const { accessToken } = await getAccessToken(req, res);
  console.log('accessToken: ', accessToken);
  return res;
});

ApolloWrapper.tsx

const ApolloWrapper = ({ children }: any) => {
  const httpLink = new HttpLink({
    uri: process.env.NEXT_PUBLIC_GRAPHQL_ENDPOINT,
  });
  const authLink = setContext(async (_, { headers }) => {
    // get the authentication token from local storage if it exists
    const token ='add token'';
    return {
      headers: {
        ...headers,
        authorization: token ? 'Bearer ${token}' : '',
      },
    };
  });

  const authHttpLink = ApolloLink.from([
    authLink,
    new RetryLink(),
    typeof window === 'undefined'
      ? ApolloLink.from([
          new SSRMultipartLink({
            stripDefer: true,
            cutoffDelay: 200,
          }),
          httpLink,
        ])
      : httpLink,
  ]);

  const makeClient = () =>
    new NextSSRApolloClient({
      cache: new NextSSRInMemoryCache(),
      link: authHttpLink,
    });

  return (
    <ApolloNextAppProvider makeClient={makeClient}>
      {children}
    </ApolloNextAppProvider>
  );
};
export default ApolloWrapper;

how using ApolloNextAppProvider with Auth0?

0 Replies