Session Not Found

[zerokarafont]

Before creating a new issue, please confirm:

• [X] I have searched for duplicate or closed issues and discussions.
• [X] I have tried disabling all browser extensions or using a different browser
• [X] I have tried deleting the node_modules folder and reinstalling my dependencies
• [X] I have read the guide for submitting bug reports.

On which framework/platform are you having an issue?

React

Which UI component?

Liveness

How is your app built?

Webpack

What browsers are you seeing the problem on?

Chrome

Which region are you seeing the problem in?

us-east-1

Please describe your bug.

I can run well with my local cdk nodejs api, however when i deploy api aws and access online api in my frontend, the Liveness component show this error: Session Not Found .

What's the expected behaviour?

At this point the FacelivenessDetection component should start scanning the face.

Help us reproduce the bug!

similar to https://github.com/aws-amplify/amplify-ui/issues/5043#issue-2170152040, the difference is i use custom credentials provider and my backend is aws cdk. I don't configure amplify cli becase the use of custom credentials provider. Even i configure amplify, the error still occurs.

Code Snippet

const credentialProvider: AwsCredentialProvider = async () => {
  return Promise.resolve({
    accessKeyId: '',
    secretAccessKey: '',
    sessionToken:
      '',
    expiration: new Date(''),
  });
};

export const AWSFaceLivenessDetector: FC = () => {
  const [loading, setLoading] = useState<boolean>(true);
  const [createLivenessApiData, setCreateLivenessApiData] = useState<{
    sessionId: string;
  } | null>(null);

  const nav = useNavigate();

  console.log('sessionId', createLivenessApiData?.sessionId);

  useEffect(() => {
    const fetchCreateLiveness: () => Promise<void> = async () => {
      /*
       * This should be replaced with a real call to your own backend API
       */
      const response = await request
        .get<any, { sessionId: string }>('https://xxx.com/aws/face/getFaceLivenessSessionId')
        .catch((e: any) => {
          toast.error(typeof e === 'string' ? e : e?.message);
          return null;
        });
      const data = response;

      setCreateLivenessApiData(data);
      setLoading(false);
    };

    fetchCreateLiveness();
  }, []);

  const handleAnalysisComplete: () => Promise<void> = async () => {
    /*
     * This should be replaced with a real call to your own backend API
     */
    const response = await request
      .get<any, { isLive: boolean }>(
        `https://xxx.com/aws/face/getFaceLivenessSessionResults/${createLivenessApiData?.sessionId}`
      )
      .catch((e: any) => {
        toast.error(typeof e === 'string' ? e : e?.message);
        return null;
      });

    const data = response;
    /*
     * Note: The isLive flag is not returned from the GetFaceLivenessSession API
     * This should be returned from your backend based on the score that you
     * get in response. Based on the return value of your API you can determine what to render next.
     * Any next steps from an authorization perspective should happen in your backend and you should not rely
     * on this value for any auth related decisions.
     */
    if (data?.isLive) {
      toast.success('Successfully Verfied');
    } else {
      toast.error('Verification Failed');
    }

    nav('/xhs');
  };

  return (
    <ThemeProvider>
      {loading ? (
        <Loader />
      ) : (
        <FaceLivenessDetectorCore
          sessionId={createLivenessApiData?.sessionId || ''}
          region="us-east-1"
          onAnalysisComplete={handleAnalysisComplete}
          onError={(error: LivenessError) => {
            toast.error(error.error.message);
          }}
          onUserCancel={() => {}}
          config={{ credentialProvider }}
        />
      )}
    </ThemeProvider>
  );
};

Console log output

Additional information and screenshots

No response

[esauerbo]

Hi @zerokarafont thanks for creating this issue. Were you able to take a look at our troubleshooting guide? It outlines two common reasons for seeing the 'Session not found' error. It looks like you're setting the region to us-east-1, so double check that the backend is using the same region.

Let us know if the guide doesn't help, and we can debug further from there.

[zerokarafont]

i am sure my lambda in the same region, the problem is it worked well on local dev, but not work when i deployed on aws. i have checked troublesshooting.

[esauerbo]

Even if the lambda is in the same region, it's still possible that the region is being set incorrectly in the API calls to Rekogniton. Can you look for this line in the lambda code and see which region is getting set? const client = new RekognitionClient({ region: <region> });

If the above doesn't address your issue, can you try removing the FaceLivenessDetectorCore component and making the StartFaceLivenessSession call with the using the AWS JS SDK instead? Like this. You can use the sessionId returned from fetchCreateLiveness. (Removing the UI component will help us better diagnose a root cause.)

[zerokarafont]

const stsClient = new STSClient({ region: 'us-east-1' }), const rekogClient = new RekognitionClient({ region: 'us-east-1' }) it's right in code. I got other helpful case, command GetSessionTokenCommand works well locally but got Cannot call GetSessionToken with session credentials online.

package.json "dev": "cdk synth --profile face-dev && sam local start-api --host 0.0.0.0 --port 9000 --container-host docker.for.mac.localhost --template cdk.out/*.template.json"

"deploy": "cdk deploy --profile face-dev --platform linux/amd64"

[zerokarafont]

My CDK config const stsPolicy = new iam.PolicyStatement({ actions: [ "sts:GetCallerIdentity", "sts:GetSessionToken" ], resources: ['*'], }); const rekognitionPolicy = new iam.PolicyStatement({ actions: ['rekognition:*'], resources: ['*'], }); fn.role?.attachInlinePolicy(new iam.Policy(this, 'FaceDev', { statements: [rekognitionPolicy, stsPolicy] }));

[reesscot]

@zerokarafont Can you please try calling StartFaceLivenessSession from your frontend using the sessionId from your deployed lambda?

[zerokarafont]

I tried, not work

[esauerbo]

@zerokarafont can send us what you tried and what error message you got, and we'll try to help you get it working.

[zerokarafont]

i will try to reproduce a minimum repo tomorrow, much thanks.

[zerokarafont]

@reesscot @esauerbo https://github.com/zerokarafont/aws-liveness-issue-replay , i made a replay repo please check thanks!

[zerokarafont]

hello, any update?

[esauerbo]

Hi @zerokarafont looks like this repo is using the FaceLivenessDetectorCore component. Can you attempt a reproduction without the UI component? You can use the StartFaceLivenessSession command to call the Recognition API directly using the session Id from fetchCreateLiveness.

I believe you mentioned that you tried this and it didn't work, so if you're able to tell us what you tried and what error you got we can help from there.

This issue typically indicates a configuration issue, so using the StartFaceLivenessSession api directly will help us find the root cause.

[esauerbo]

@zerokarafont here's a sample repo showing how to make this API call. You'll likely need to make some modifications but can you try pulling this down and see if you get the same error? https://github.com/esauerbo/rekognition-sdk-repro/tree/main

You can retrieve the required credentials by going to Isengard -> Console Roles -> Click the copy button to access AWS console/temporary credentials

[zerokarafont]

@esauerbo tried this repo https://github.com/esauerbo/rekognition-sdk-repro/tree/main, it works on my credential, but got error if i fill in sessionId from my lambda , it seems like prod configuration problem, i have already checked all cases, dont know how to fix it.

[zerokarafont]

avoid using custom credentials provider