How to authenticate user with id_token? (no modal + Cognito + authorization code flow)

[jamgalaxy]

Hi everyone!

On our project, we’re using no-modal solution together with AWS Cognito and authorization code flow. We proceeded according this Web3Auth recipe.
We are testing this flow using the Google provider. We successfully logged the user in via Cognito and, in the server-side callback, we managed to retrieve the id_token. However, when attempting to authenticate the user with Web3Auth using the retrieved id_token, we encounter the following error:
Failed to connect with auth provider LoginError: Popup was blocked. Please call this function as soon as user clicks button or use redirect mode.

Here’s the code we are using to authenticate the user:

 const web3authProvider = await web3Auth.connectTo(WALLET_ADAPTERS.AUTH, {
          loginProvider: 'jwt',
          extraLoginOptions: {
            id_token: idToken,
            domain: '<OUR_COGNITO_DOMAIN>',
            verifierIdField: 'email', // this is same as we got set for the related verifier in Web3Auth dashboard
          },
        })

My questions:

1. Should the connectTo try to open Web3Auth UI even though we already authenticated the user via Cognito?
2. What is the correct approach to authenticate the user with Web3Auth if they are already authenticated through Cognito?

Thank you for your assistance!

[w3abot]

Hi Jam Galaxy!

Thank you for reaching out with your detailed query! It sounds like an interesting integration you’re working on. Let’s break down your message to gather all the pertinent details for our support team:

SDK Details:

• SDK Name: Not provided

Issue:

• Authentication with id_token using no-modal solution and AWS Cognito in authorization code flow.

Details of the Issue:

• You followed the Web3Auth recipe for AWS Cognito.
• Successfully logged in via Cognito and retrieved id_token.
• Encountering the error: Failed to connect with auth provider LoginError: Popup was blocked. Please call this function as soon as user clicks button or use redirect mode.

Code Snippet:

const web3authProvider = await web3Auth.connectTo(WALLET_ADAPTERS.AUTH, {
  loginProvider: 'jwt',
  extraLoginOptions: {
    id_token: idToken,
    domain: '<OUR_COGNITO_DOMAIN>',
    verifierIdField: 'email', // same as set for the related verifier in Web3Auth dashboard
  },
});

Questions:

1. Should the connectTo function attempt to open Web3Auth UI despite authentication via Cognito?
2. What is the correct approach to authenticate the user with Web3Auth if they are already authenticated through Cognito?

Proposed Solutions:

1. The connectTo function should not need to open the Web3Auth UI if you’re handling authentication through Cognito already. It may be that you’re inadvertently calling it as part of your flow, which could trigger the error about popups being blocked.

2. To properly authenticate using Web3Auth after Cognito authentication, ensure that:

   • The id_token is correctly passed and is valid.
   • You’ve configured your Web3Auth dashboard to recognize the Cognito verifier.

If you have additional insights, such as the SDK version or if you’re using own authentication settings, that could help us further streamline the support.

Please let me know if you have any images or console outputs that could provide more context! I’m here to help you through this.

Best of luck with your integration, and I’m looking forward to your reply!

Note: This response was generated by an AI bot and may require further verification. The Web3Auth support team has tracked this issue and will be responding as soon as possible.