Next app router + Auth0 + Web3Auth SFA

Hello everyone.

I am developing a web app using Next 13 and the App Router. What I Want to achieve is a simple application where there are 2 types of users:
User 1 → Authenticated via Auth0
User 2 → Authenticated via Auth0 and a special dashboard (like in /account/web3) where they can access their web3 wallet under the hood.

Since the user in order to access to /account/web3 is already authenticated (via google for example), I want that when he clicks the button “access wallet” the function web3auth.connect() is executed without ask him again the authentication (since as I said, is already authenticated)
Unfortunately it requires the tokenId (JWT).
I have managed to access the tokenId via “await getSession” but I get in the console “nextjs-auth0 is attempting to set cookies from a server component”. Moreover, after the first successful login I tried to refresh the page and the session was gone. Obviously, re-authenticating throw the error that the JWT has already been used.

How do you think I can solve this problem? What is the best practice to get the JWT and pass it to the connect function?

Here a snippet of my code (session is passed as props from the parent server component)

const createWallet = async () => {
        const idToken = session.idToken!
        const subVerifierInfoArray = [
            {
                verifier: "XXXXX",
                idToken: idToken,
            },
        ];
        const tmpProvider = await web3authSfa.connect({
            verifier,
            verifierId: session.user.sub,
            idToken: idToken,
            subVerifierInfoArray,
        });

        if (tmpProvider) {
            setProvider(tmpProvider)
        }
    }

Thank you :slight_smile:

@Sapessi Welcome Aboard!

Thanks for your detailed post.

Your request has been forwarded to our Dev team and we will get back to you when there is a meaningful update to share.

Please check this doc: JWT Errors | Documentation | Web3Auth

You cannot reuse an id token, it gets invalidated once used to generate key. The only way is to generate a new id token everytime. The ideal approach would be to keep the access token with yourself and get idToken every time you need to.
Otherwise if it’s your own server you can easily generate another id token on request.

Thank you, and do you have any idea of how I can do it with auth0? Because I can’t find anything online about it.
Because I have been successfully implemented the session persistent but I can’t find a way to link the Auth0 token id expiration with the web3auth sessions.

This is the ideal flow:

  1. user login with google (or whatever it is)
  2. user access /account/web3 and in the background it gets the token_id from auth0, authorize web3auth and subsequently a wallet is generated. (Until now everything works fine)
  3. Auth0 token_id expires (and immediately the web3auth authentication too), if I navigate to /account/web3 I want that a new token_id is generated and passed to web3auth SFA. And again it repeats the same flow