Getting JWT token to front end for auth0 nextjs sdk

Help
,
1

Please include the following information in your post:

  • Which SDK this is regarding: nextjs-auth0
  • SDK Version: v1.9.1
  • Platform Version:
  • Code Snippets/Error Messages/Supporting Details/Screenshots:

Hey there! I am currently working on converting our app from a CRA spa to a nextjs app, and its mostly going well but now I’m at the point where I’m trying to get the front end graphql client (I’m using appsync) which requires an id_token as the JWT. I want to verify if I’m doing anything wrong here. On the SPA I was using the getTokenSilently function from the auth0-spa-js sdk, but want to grab it from a protected endpoint in my NextJS app now:

My graphql client which expects a JWT:

export const secureAppSyncClient = new AppSyncClient({
url: process.env.NEXT_PUBLIC_COMPANYQL_URL ?? ‘’,
region: process.env.NEXT_PUBLIC_REGION ?? ‘’,
auth: {
type: AUTH_TYPE.OPENID_CONNECT,
jwtToken: async () => {
const response = await fetch(‘http://localhost:3000/api/token’);
const { accessToken } = await response.json();
return accessToken;
},
},
disableOffline: true,
});

My api/token endpoint:

import { withApiAuthRequired } from ‘@auth0/nextjs-auth0’;
import auth0 from ‘…/…/lib/auth0’;

export default withApiAuthRequired(async function token(req, res) {
const client = await auth0(req);

const { accessToken } = await client.getAccessToken(req, res, { refresh: true });
res.status(200).json({ accessToken });
});

and my api/auth/[...auth0] endpoint:

export default async (request: NextApiRequest, response: NextApiResponse) => {
const client = await auth0(request);

return client.handleAuth({
async login(req, res) {
try {
await client.handleLogin(req, res, {
authorizationParams: {
audience: process.env.AUTH0_AUDIENCE,
scope: ‘openid profile email’,
response_type: ‘code’,
},
});
} catch (error) {
res.status(error.status || 400).end(error.message);
}
},
})(request, response);
};

Thank you!