Get an Access Token on Login via Next.JS

Problem statement

What is the purpose of the Access Token login via getSession, when using the Next.js quickstart?

Solution

Follow these steps:

  1. Download the Next.JS Quickstart and follow the instructions to install and configure it.
  2. Add the required environment variables to the file .env.local.
  3. Open the file /app/ssr/page/page.jsx

In the function SSRPage(), add the highlighted (bold font) code shown below to enable access to the Access Token.

async function SSRPage() {
    const { user } = await getSession();
    const { accessToken } = await getSession();
    return (
      <>
        <div className="mb-5" data-testid="ssr">
<div className="result-block">
    <h6 className="muted">User</h6>
    <Highlight>{JSON.stringify(user, null, 2)}</Highlight>
    <Highlight>{JSON.stringify(accessToken)}</Highlight>
</div>

This highlighted code helps to insert an Access Token into the Next JS Quickstart on login.
By including an audience for an external API in the env file, it is possible to obtain an Access Token to access that API.

Related References

1 Like