RespondToAuthChallenge - Got error when clicking on Magic link

[ningo-agilityio]

Hi owner,

Currently, I followed your sample to implement Passwordless auth on Cognito. But in client side, I'm using another technical stack with Next.js and aws-amplify. After receiving Magic link from email, I got this error when calling confirmSignIn from aws-amplify/auth: error UserUnAuthenticatedException: User needs to be authenticated to call this API. I'm handling Sign In and Verify on different page, so how can I keep session cross tab? Many people is facing the same issue as me https://github.com/aws-amplify/amplify-js/issues/13071. Could you help to look into and support me?

Thanks!

[ottokruse]

Hi! I can try but I'd need much more info:

• What version of amazon-cognito-passwordless-auth are you on?
• How did you implement the client side then? I need to see the code.
• Can you log localStorage (or cookies, whatever you're using) before calling confirmSignIn() and you see valid JWTs there? Wonder at which point the JWTs appear in storage. Looks like a timing mismatch / race condition.

[ningo-agilityio]

Hi @ottokruse,

• I'm using the latest code from cdk stack
• From client side, I'm using tech stack React & Next.js, below are version details:

  "aws-amplify": "^6.0.27",
  "next": "14.1.4",
  "react": "^18",

You can see my 2 separated functions for signIn and confirmSignIn as below:

import {
  signIn,
  confirmSignIn,
  getCurrentUser
} from "aws-amplify/auth";
...
export async function handleSignIn(
  prevState: string | undefined,
  formData: FormData
) {
  let redirectLink = "/auth/verify";
  try {
    const tmpSession = await signIn({
      username: String(formData.get("email")),
      options: {
        authFlowType: "CUSTOM_WITHOUT_SRP",
      }
    });
    localStorage.setItem('session', JSON.stringify(tmpSession))

    const currentAuth = await getAuthToken();
    const currentUser = await getCurrentUser();
    console.log('current user after sign in', currentAuth, currentUser)

    setTimeout(async () => {
      if (tmpSession.nextStep.signInStep === "CONFIRM_SIGN_IN_WITH_CUSTOM_CHALLENGE") {
        redirectLink = "/auth/verify";
      }
    }, 1000)
  } catch (error) {
    console.log('error', error)
    return getErrorMessage(error);
  } finally {
    redirect(redirectLink);
  }
}

export async function handleConfirmSignIn(
  prevState: string | undefined,
  formData: FormData
) {
  let redirectLink = "/auth/verify";
  const tmpSession = JSON.parse(localStorage.get('session'))

  try {
    const currentAuth = await getAuthToken();
    const currentUser = await getCurrentUser();
    console.log('current user after sign in', currentAuth, currentUser)

    setTimeout(async () => {
      const session = await confirmSignIn({
        challengeResponse: String(formData.get("token")),
      });
      if (session.isSignedIn) {
        const user = await getCurrentUser();
        console.log('isSignedIn', user);
        redirectLink = "dashboard";
      }
    }, 1000)
  } catch (error) {
    console.log('error', error)
    return getErrorMessage(error);
  } finally {
    redirect(redirectLink);
  }
}

• There is no data was saved in both localStorage and cookies after sign in, even though the Cognito returns 200 and I can see response from Network

  {
  "isSignedIn": false,
  "nextStep": {
  "signInStep": "CONFIRM_SIGN_IN_WITH_CUSTOM_CHALLENGE",
  "additionalInfo": {
    "USERNAME": "a4c82448-6051-7064-9cd4-71354463fd7c",
    "secretLoginCode": "M6FtiA"
  }
  }
  }

[ottokruse]

Don't see the problem or solution quickly from this code and struggle to see the link with the Passwordless lib as well. But is it an option for you to auto confirm users ?

[ningo-agilityio]

@ottokruse The issue is when I call confirmSignIn from another page, this function will throw error error UserUnAuthenticatedException: User needs to be authenticated to call this API.