Passwordless link login redirects with the 'id_token not present in TokenSet' message on NextJS

[ccismas]

Hi! I’m trying to log in using the passwordless method with magic link, with the nextjs package (@auth0/nextjs-auth0), and everything is going well until I click on the link that I receive in my inbox. When I click on the link, it redirects me to http://localhost:3000/en/api/auth/callback#access_token=SOME_TOKEN&scope=openid&expires_in=7200&token_type=Bearer. Inside pages/api/auth/[…auth0].js I have this:

import auth0 from '../../../../utils/auth0';
export default auth0.handleAuth();

and inside utils/auth0 I have this:

import { initAuth0 } from '@auth0/nextjs-auth0';
import { env } from '../next.config';

export default initAuth0({
  baseURL: env.AUTH0_BASE_URL,
});

And when I get redirected to localhost, I get this response: id_token not present in TokenSet

Any ideas?

Update:

After upgrading the package from 1.9.2 to 2.2.1 I’m getting a different error: Callback handler failed. CAUSE: Missing state parameter in Authorization Response.

[rueben.tiow]

Hi @ccismas,

Welcome to the Auth0 Community!

I understand that you are encountering the Missing State Parameter error.

This error can happen when the login request (/authorize) is missing the state query parameter.

The request should look something like the following:

https://YOUR_DOMAIN/authorize?
    response_type=code&
    client_id=YOUR_CLIENT_ID&
    redirect_uri=https://YOUR_APP/callback&
    scope={scope}&
    audience={apiAudience}&
    state={state}

To help you troubleshoot further, could you please capture the login events in a HAR file and send them to me via DM’s?

In the meantime, I recommed checking out this related FAQ on Why do I get a state mismatch error if I try to log in from different tabs?.

I look forward to hearing from you.

Thanks,
Rueben

[ccismas]

Hi @rueben.tiow , thanks for replying.

I was using embedded login for passwordless, as in, I’ve had an input in my web page, and then I would send an axios request with the email to {tenantUrl}/passwordless/start, but the I checked the /api/auth/login route (handled by auth0/next-auth0), and it seems like the package handles this by setting some cookies before sending the request (nonce, state, i think there was one more?). I guess these cookies are verified on the api/auth/callback route when getting redirected from the magic link, which is why I’m getting this error.

Would it be viable to set these cookies myself before firing the request to passwordless/start, while still using the auth0/next-auth0 package? If so, could you point me to some documentation about these cookies?

In case this is not possible, would the auth0-js package help me more here?

[davidheyman]

I had the same issue and fixed it in v2.2.1 by changing my […auth0] file to:

import { handleAuth, handleLogin } from '@auth0/nextjs-auth0';

export default handleAuth({
  async login(req, res) {
    try {
      await handleLogin(req, res, {
        authorizationParams: {
          connection_scope: 'openid profile',
        },
      });
    } catch (error: unknown) {
      console.error(error);
    }
  },
});

Hope this helps!

[rueben.tiow]

Hi @davidheyman,

Thank you for your reply.

@ccismas

I would send an axios request with the email to {tenantUrl}/passwordless/start, but the I checked the /api/auth/login route (handled by auth0/next-auth0), and it seems like the package handles this by setting some cookies before sending the request (nonce, state, i think there was one more?). I guess these cookies are verified on the api/auth/callback route when getting redirected from the magic link, which is why I’m getting this error.

This is correct. The state error you mentioned would suggest that the transient state cookie is missing when your browser returns to the /callback URL.

When you go to /login, the express middleware will leave some cookies with the app state and a nonce (and possibly some others), it’ll then use those cookies to verify the token it gets back from the auth server. [Reference: BadRequestError: checks.state argument is missing · Issue #145 · auth0/express-openid-connect · GitHub]

And unfortunately, and AFAIK, we do not have any examples around setting the cookies manually.

@ccismas

In case this is not possible, would the auth0-js package help me more here?

Could you please try configuring an Auth0LockPasswordless instance with the Auth0.js package?

This should handle the state for you.

Please let me know if this works for you.

Thanks,
Rueben