Amazon Rekognition Liveness Detection in Angular

AWS recently launched the Amazon Rekognition Face Liveness feature. This new feature helps deter fraud in facial verification.

Automated Liveness Detection

  • With AWS Amplify you could easily plug Face liveness detection on your Android/IOS/Browser. It currently supports the below frameworks:

    1. Android
    2. React
    3. Swift
  • This solution allows you to integrate Amazon Rekognition face liveness with your existing Angular Application. It uses the FaceLivenessDetector component from React and wraps it as an Angular Component.

  • FaceLivenessDetector component is responsible from starting the liveness session. Once the results are ready it notifies us via callback functions.

Steps to run using AWS Amplify

  1. Install Amplify CLI on your local machine
   npm install -g @aws-amplify/cli
  1. Configure Amplify CLI
   amplify configure
  1. Clone this project
   git clone <TODO add path>
  1. Open a new terminal. From the root of the project, run:
   amplify init

amplify_init

  1. Install Project dependencies. Fire the below command in a terminal from the root of your project foler
   npm install
  1. Add Cognito Authentication. Fire the below command in a terminal from the root of your project folder
  amplify add auth

amplify_add_auth

  1. Push your changes
  amplify push
  1. Verify if aws-exports.ts file has all the Auth details. We reference properties from this file when generating creadentials to communicate with Amazon Rekognition. amplify_exportjs

  2. Update IAM permissions. Search for IAM role of type 'amplify-{your-app-name}-{environment}-{random-number}-authRole' generated by amplify and add the below inline policy that supports liveness detection features

   {
    "Version": "2012-10-17",
    "Statement": [
        {
            "Effect": "Allow",
            "Action": "rekognition:StartFaceLivenessSession",
            "Resource": "*"
        },
        {
            "Effect": "Allow",
            "Action": "rekognition:CreateFaceLivenessSession",
            "Resource": "*"
        },
        {
            "Effect": "Allow",
            "Action": "rekognition:GetFaceLivenessSessionResults",
            "Resource": "*"
        }
    ]
}

amplify_auth_role amplify_attach_policy

  1. To run on local machine
   ng serve
  1. To view the hosted application on Amplify
   amplify console
  1. Once you create an account and login you should see the below screen main_screen

  2. Click on Begin Check for automated liveness detection challenge1

  3. Wait for verification. This service gives you a confidence score for face liveness. verification