Getting Invalid JWT Using getAccessToken method

[louisvillerbc]

SDK Info: nextjs-auth0
SDK Version: 1.6.1
Platform: Node 14.18.0 on Ubuntu 18.04

I am working on a small nextJS web app, and am using the nextJS auth0 library and having trouble authenticating to my external api using the access token returned by the code below (which I have in a file underneath the pages/api directory). It seems like it is returning an auth code…not an auth token as the value generally looks something like “syyz9m0i-Nkubst3QyCb7TsRBNLVR0_i”.

I have followed the basic setup steps for nextJS auth0 here, and have the dynamic routes setup for logging in, etc… I am able to login fine, but when I try to fetch my external api below, I get back {"code":401,"message":"Jwt is not in the form of Header.Payload.Signature with two dots and 3 sections"} . Which makes sense given the value that is being returned above…but why is it not returning me an actual valid JWT auth token??

api code:

import { getAccessToken, withApiAuthRequired } from '@auth0/nextjs-auth0';

export default withApiAuthRequired(async function families(req, res) {
  // If your Access Token is expired and you have a Refresh Token
  // `getAccessToken` will fetch you a new one using the `refresh_token` grant
  const { accessToken } = await getAccessToken(req, res);
  console.log(accessToken);
  const response = await fetch('https://myprotectedexternalapi.com/endpoint', {
    headers: {
      Authorization: `Bearer ${accessToken}`
    }
  });
  const data = await response.json();
  res.status(200).json(data);
});

My calling code to the api above:

import { getAccessToken, withPageAuthRequired } from '@auth0/nextjs-auth0';

import useSWR from 'swr';

const fetcher = (url) => fetch(url).then((res) => res.json());

export default withPageAuthRequired(
    function Directory({ user, families }) {
        const { data } = useSWR('/api/families', fetcher);

        return (
            <div>
                <p>THE DATA ({user.email})</p>
                <div>
                    {JSON.stringify(data)}
                </div>
            </div>
        );
    }
);

[rueben.tiow]

Hi @louisvillerbc,

Thanks for reaching out to the Auth0 Community!

I understand you have had issues accessing your API, specifically with an invalid JWT token.

Generally, this happens when the audience parameter is not passed as part of the /authorize request.

In this case, please take a look at this related Community topic which documents the solution.

Please let me know if you have any further questions.

Thank you.