Mobile SDK stages

The Mobile SDK supports the stages below.

Welcome

This is the first screen and will always default to show as the first screen. It displays a welcome message and a summary of the stages you have configured for the client.

The welcome screen allows you to set a custom title.

iOS

let welcomeStage = WelcomeStageBuilder()
  .setTitle(title: "Custom Screen Title")
  .setMessage(message: "Custom welcome message.")
  .build()

Android

// Kotlin

var welcomeStage = Welcome(
    title = "Custom Screen Title",
    message = "Custom welcome message."
)

 // Java
 
 Welcome welcome = new Welcome(
     "Custom Screen Title",
     "Custom welcome message",
     null
 );

React Native

const settings = {
  // ... other settings
  stages: [
    {
      name: "intro",
      heading: "Custom Screen Title",
      message: "Custom welcome message.",
    },
    // ... other stages
  ],
};

Flutter

final settings = {
  // ... other settings
  "stages": [
    {
      "name": "intro",
      "heading": "Custom Screen Title",
      "message": "Custom welcome message.",
    },
    // ... other stages
  ],
};

Cordova

const settings = {
  // ... other settings
  stages: [
    {
      name: "intro",
      heading: "Custom Screen Title",
      message: "Custom welcome message.",
    },
    // ... other stages
  ],
};

Consent

You can optionally add this stage to enforce explicit consent collection before the client can progress in the flow.

The consent screen allows you to set a custom title.

iOS

let consentStage = UserConsentStageBuilder()
     .setTitle(title: "Terms of Service")
     .build()

Android

// Kotlin

var consentStage = Consent(
    title = "Custom Consent Screen Title"
)

// Java

UserConsent userConsent = new UserConsent(
    "Custom Consent Screen Title",
    null,
    null
);

React Native

const settings = {
  // ... other settings
  stages: [
    {
      name: "consent",
      heading: "Custom Consent Screen Title"
    },
    // ... other stages
  ],
};

Flutter

final settings = {
  // ... other settings
  "stages": [
    {
      "name": "consent",
      "heading": "Custom Consent Screen Title"
    },
    // ... other stages
  ],
};

Cordova

const settings = {
  // ... other settings
  stages: [
    {
      name: "consent",
      heading: "Custom Consent Screen Title"
    },
    // ... other stages
  ],
};

Selfie photo and video

You can request a selfie photo (i.e. a Live Photo for an Identity Check) capture or video (i.e. a Live Video for an Enhanced Identity check) capture from your client.

• Photo - will take a photo of the client and perform a liveness check before allowing them to submit.

iOS

let selfieStage = BiometricStageBuilder()
  .setType(type: .photo)
  // Enable ML assistance during capture
  .setEnableMLAssistant(enable: false)
  .build()

Android

// Kotlin

var selfiePhoto = SelfiePhoto(
    // Enable ML assistance during capture
    isMLAssistantEnabled = false
)

// Java

SelfiePhoto selfiePhoto = new SelfiePhoto(
    // isGuidanceEnabled
    true,
    // useLiveCaptureOnly
    true,
    // isMLAssistanceEnabled
    false,
    // retryLimit
    5
);

React Native

const settings = {
  // ... other settings
  stages: [
    {
      name: "faceCapture",
      mode: "photo",
      // Enable ML assistance during capture
      useMLAssistance: false,
    },
    // ... other stages
  ],
};

Flutter

final settings = {
  // ... other settings
  "stages": [
    {
      "name": "faceCapture",
      "mode": "photo",
      // Enable ML assistance during capture
      "useMLAssistance": false,
    },
    // ... other stages
  ],
};

Cordova

const settings = {
  // ... other settings
  stages: [
    {
      name: "faceCapture",
      mode: "photo",
      // Enable ML assistance during capture
      useMLAssistance: false,
    },
    // ... other stages
  ],
};

• Video - will take a video of the client and request them to perform a challenge before allowing them to submit.

iOS

let videoStage = BiometricStageBuilder()
  .setType(type: .video)
  // Enable ML assistance during capture
  .setEnableMLAssistant(enable: false)
  .build()

Android

// Kotlin

var selfieVideo = SelfieVideo(
    // Enable ML assistance during capture
    isMLAssistantEnabled = false
)

// Java

 SelfieVideo selfieVideo = new SelfieVideo(
     // isGuidanceEnabled
     true,
     // isMLAssistanceEnabled
     false,
     // retryLimit
     5
 );

React Native

const settings = {
  // ... other settings
  stages: [
    {
      name: "faceCapture",
      mode: "video",
      // Enable ML assistance during capture
      useMLAssistance: false,
    },
    // ... other stages
  ],
};

Flutter

final settings = {
  // ... other settings
  "stages": [
    {
      "name": "faceCapture",
      "mode": "video",
      // Enable ML assistance during capture
      "useMLAssistance": false,
    },
    // ... other stages
  ],
};

Cordova

const settings = {
  // ... other settings
  stages: [
    {
      name: "faceCapture",
      mode: "video",
      // Enable ML assistance during capture
      useMLAssistance: false,
    },
    // ... other stages
  ],
};

If you attempt to add both types of stages, the SDK will throw a ComplyCubeErrorCode.BiometricStageCount error stating multiple conflicting stages.

Document

This stage allows clients to select the type of identity document they would like to submit. You can customize these screens to:

• Limit the scope of document types the client can select, e.g., Passport only.

• Set the document issuing countries they are allowed for each document type.

• Add or remove automated capture using smart assistance.

• Show or hide the instruction screens before capture.

• Set a retry limit to allow clients to progress the journey regardless of capture quality.

If you provide only one document type, the document type selection screen will be skipped. The country selection screen will be skipped if you provide only a single country for a given document type.

You can remove the information screens shown before camera captures by enabling or disabling guidance. You should only consider omitting this if you have clearly informed your client of the capture steps required.

iOS

let docStage = DocumentStageBuilder()
  // Set document types and limit the enabled countries
  .setAllowedDocumentTypes(types: [
    .passport,
    .drivingLicence(["GB", "US"]),
    .nationalIdentityCard(),
  ])
  // Set a maximum for quality check attempts before uploading
  .setRetryLimit(count: 3)
  // Enable or disable additional guidance for the user
  .setShowGuidance(enable: true)
  // Enable ML assistance during capture
  .setEnableMLAssistant(enable: true)
  .build()

Android

// Kotlin

var documentStage = Document(
    // Set document types and limit the enabled countries
    Passport(), DrivingLicence((Country.GB, Country.US)),

    // Enable or disable additional guidance for the user
    isGuidanceEnabled = true,

    // Enable or disable the ability to upload an image from file
    useLiveCaptureOnly = true,

    // Enable ML assistance during capture
    isMLAssistantEnabled = true,
    
    // Set a maximum for quality check attempts before uploadingoft checks
    retryLimit = 3
)

// Java

IdentityDocumentType[] identityDocumentTypes;

identityDocumentTypes = new IdentityDocumentType[1];

identityDocumentTypes[0] = new DrivingLicence();

Document document = new Document(
    null,
    identityDocumentTypes, // documentTypes
    true, // isGuidanceEnabled
    false, // useLiveCaptureOnly
    true, // isMLAssistanceEnabled
    5, // retryLimit
    true // isNFCEnabled
);

React Native

const settings = {
  // ... other settings
  stages: [
    {
      name: "documentCapture",

      // Enable or disable additional guidance for the user
      showGuidance: false,

      // Enable ML assistance during capture
      useMLAssistance: true,

      // Set a maximum for quality check attempts before uploading
      retryLimit: 1,

      // Enable or disable the ability to upload an image from file
      liveCapture: false,

      // Set document types and limit the enabled countries
      documentTypes: {
        passport: true,
        driving_license: ["GB", "US"],
      },
    },
    // ... other stages
  ],
};

Flutter

final settings = {
  // ... other settings
  "stages": [
    {
      "name": "documentCapture",

      // Enable or disable additional guidance for the user
      "showGuidance": false,

      // Enable ML assistance during capture
      "useMLAssistance": true,

      // Set a maximum for quality check attempts before uploading
      "retryLimit": 1,

      // Enable or disable the ability to upload an image from file
      "liveCapture": false,

      // Set document types and limit the enabled countries
      "documentTypes": {
        "passport": true,
        "driving_license": ['GB', 'US'],
      },
    },
    // ... other stages
  ],
};

Cordova

const settings = {
  // ... other settings
  stages: [
    {
      name: "documentCapture",

      // Enable or disable additional guidance for the user
      showGuidance: false,

      // Enable ML assistance during capture
      useMLAssistance: true,

      // Set a maximum for quality check attempts before uploading
      retryLimit: 1,

      // Enable or disable the ability to upload an image from file
      liveCapture: false,

      // Set document types and limit the enabled countries
      documentTypes: {
        passport: true,
        driving_license: ["GB", "US"],
      },
    },
    // ... other stages
  ],
};

Please note the retryLimit you set here will take precedence over the retry limit that has been set globally in your automation settings.

NFC capture

Please get in touch with your Account Manager or support to get access to our NFC-enabled Mobile SDK.

ComplyCube's Mobile SDK enables NFC-based RFID chip reading in identity documents for accurate authentication and data extraction.

Pre-requisites

iOS

To use this feature, your app must have the Near Field Communication Tag Reading capability enabled. To add this capability to your app, refer to Apple's guide here.

CocoaPods

1. Install the CocoaPods Artifactory plugin by running the following command in your terminal:

   gem install cocoapods-art

2. To add the library, copy your repository credentials into a .netrc file to your home directory and setup the repository:

   pod repo-art add cc-cocoapods-release-local "https://complycuberepo.jfrog.io/artifactory/api/pods/cc-cocoapods-release-local"

   Remember to fetch your credentials from Jfrog using the Set Me Up button here.

3. Add plugin repos and install the pod using your Podfile:

    plugin 'cocoapods-art', :sources => [
      'cc-cocoapods-release-local',
      'trunk'
    ]
    ...
    platform :ios, '13.0' # Or above
   
    target 'YourApp' do
      use_frameworks!
      use_modular_headers!
      ...
      pod 'ComplyCubeMobileSDK'
      ...
    en

4. You must add the following keys to your application Info.plist file:

<key>NFCReaderUsageDescription</key>
<string>Required to read from NFC enabled documents</string>

1. To read NFC tags correctly, you need to add the following entries to your app target's Info.plist file:

<key>com.apple.developer.nfc.readersession.felica.systemcodes</key>
<array>
  <string>12FC</string>
</array>
<key>com.apple.developer.nfc.readersession.iso7816.select-identifiers</key>
<array>
  <string>A0000002471001</string>
  <string>A0000002472001</string>
  <string>00000000000000</string>
  <string>D2760000850101</string>
</array>

Android

1. Start by adding your access credentials for the ComplyCube NFC-Enabled SDK repository to the gradle.properties file of your mobile app:

artifactory_user= "USERNAME"
artifactory_password= "ENCRYPTED PASS"
artifactory_contextUrl= https://complycuberepo.jfrog.io/artifactory

1. Then, update your project level build.gradle file with the ComplyCube SDK repository Maven settings:

buildscript {
    repositories {
        ...
    }
    dependencies {
        ....
        // Check for the latest version here: 
        // http://plugins.gradle.org/plugin/com.jfrog.artifactory
        classpath "org.jfrog.buildinfo:build-info-extractor-gradle:4+"
    }
    ...
}

allprojects {
    apply plugin: "com.jfrog.artifactory"
    ...
}

artifactory {
  contextUrl = "${artifactory_contextUrl}"  
  resolve {
    repository {
      repoKey = 'cc-gradle-release'
      username = "${artifactory_user}"
      password = "${artifactory_password}"
      maven = true
    }
  }
}

1. Update your module level build.gradle file with the SDK dependency:

dependencies {
    implementation "com.complycube:complycube-sdk:+"
    implementation "com.complycube:nfc-plugin:+"
}

React Native

Please review the iOS and Android pre-requisites.

Flutter

Please review the iOS and Android pre-requisites.

Cordova

Please review the iOS and Android pre-requisites.

Enabling NFC capture

iOS

let docStage = DocumentStageBuilder()
  // Add this property to enable NFC
  .setEnableNFC(enable: true)
  .build()

Android

// Kotlin

var documentStage = Document(
    // Add this property to enable NFC
    isNFCEnabled = true,
)

// Java

IdentityDocumentType[] identityDocumentTypes;

identityDocumentTypes = new IdentityDocumentType[1];

identityDocumentTypes[0] = new Passport();

Document document = new Document(
    null,
    // documentTypes
    identityDocumentTypes,
    // isGuidanceEnabled
    true,
    // useLiveCaptureOnly
    false,
    // isMLAssistanceEnabled
    true,
    // retryLimit
    5,
    // isNFCEnabled
    true
);

React Native

const settings = {
    // ... other settings
    stages : [
      {
        name: 'documentCapture',
        // Add this property to enable NFC
        nfcCapture: true
        ...
      },
      // ... other stages
    ]
}

Flutter

final settings = {
    // ... other settings
    "stages" : [
      {
        "name": "documentCapture",
        // Add this property to enable NFC
        "nfcCapture": true
        ...
      },
      // ... other stages
    ]
}

Cordova

const settings = {
    // ... other settings
    stages : [
      {
        name: 'documentCapture',
        // Add this property to enable NFC
        nfcCapture: true
        ...
      },
      // ... other stages
    ]
}

Address capture

This stage allows clients to input their address. You can set the permitted countries and whether to enable our address autocomplete screen.

iOS

let addressCaptureStage = AddressCaptureStageBuilder()
  // This enables our address autocomplete feature
  .useAutoComplete(enable: false)
  // A list of acceptable countries for address capture feature
  .setAllowedCountries(["GB", "US"])
  .build()

Android

//Kotlin

var addressCaptureStage = AddressCapture(
    // This enables our address autocomplete
    useAutoComplete = true,
    
    // A list of acceptable countries for address capture feature
    allowedCountries = setOf(Country.GB,Country.US)
)

// Java

Set<Country> countries = new HashSet<> ();

countries.add(Country.GB);
countries.add(Country.US);

AddressCapture addressCapture = new AddressCapture(
    // useAutoComplete
    true,
    // allowedCountries
    countries
);

React Native

const settings = {
  // ... other settings
  stages: [
    {
      name: "addressCapture",

      // This enables our address autocomplete feature
      useAutoComplete: false,
      
      // A list of acceptable countries for address capture
      allowedCountries: ['GB','US']
    },
    // ... other stages
  ],
};

Flutter

final settings = {
  // ... other settings
  stages: [
    {
      "name": "addressCapture",

      // This enables our address autocomplete feature
      "useAutoComplete": false,
      
      // A list of acceptable countries for address capture
      "allowedCountries": ['GB','US']
    },
    // ... other stages
  ],
};

Cordova

const settings = {
  // ... other settings
  stages: [
    {
      name: "addressCapture",

      // This enables our address autocomplete feature
      useAutoComplete: false,
      
      // A list of acceptable countries for address capture
      allowedCountries: ["GB","US"]
    },
    // ... other stages
  ],
};

Proof of address

When requesting a proof of address document, you can set the allowed document types and whether the client can upload the document.

By default, this automatically incorporates the Address capture stage with autocomplete enabled. This option can be turned off.

iOS

let poaStage = AddressStageBuilder()
  .setAllowedDocumentTypes(types: [
    .utilityBill,
    .bankStatement
  ])
  // When disabled, the client will be forced to perform a live capture
  .useLiveCaptureOnly(enable: false)
  // This enables address capture during the proof of address flow
  .setEnableAddressCapture(true)
  .build()

Android

//Kotlin

var poaStage = ProofOfAddress(
    // A list of supported document types that can be submitted
    UtilityBill(), BankStatement(),

    // When disabled, the client will be forced to perform a live capture
    useLiveCaptureOnly = false,

    // This enables address capture during the proof of address flow
    isAddressCaptureEnabled = false
    ...
)

// Java

LinkedHashSet<ProofOfAddressDocumentType> documentTypes =
    new LinkedHashSet<ProofOfAddressDocumentType> ();

documentTypes.add(new UtilityBill());
documentTypes.add(new BankStatement());

ProofOfAddress poaStage = new ProofOfAddress(
    documentTypes,
    // isGuidanceEnabled
    true,
    // useLiveCaptureOnly
    false,
    // isMLAssistanceEnabled
    true,
    // retryLimit
    5,
    // isAddressCaptureEnabled
    false
);

React Native

const settings = {
  // ... other settings
  stages: [
    {
      name: "poaCapture",

      // When disabled, the client will be forced to perform a live capture
      liveCapture: false,
    },
    // ... other stages
  ],
};

Flutter

final settings = {
  // ... other settings
  stages: [
    {
      "name": "poaCapture",

      // When disabled, the client will be forced to perform a live capture
      "liveCapture": false,
    },
    // ... other stages
  ],
};

Cordova

const settings = {
  // ... other settings
  stages: [
    {
      name: "poaCapture",

      // When disabled, the client will be forced to perform a live capture
      liveCapture: false,
    },
    // ... other stages
  ],
};

Completion

You can add an optional completion stage at the end of the process and let the client know the process has been completed.

iOS

var completionStage = Complete(
    title: "Thank you!",
    message: "Your KYC submission has been completed"
)

Android

// Kotlin

val completionStage = Complete(
    title = "Thank you!",
    message = "Your KYC submission has been completed"
)

// Java

Complete complete = new Complete(
    "Custom Complete Title",
    "Custom Complete Message",
    null
);

React Native

const settings = {
  // ... other settings
  stages: [
    {
      name: "complete",
      heading: "Thank you!",
      message: "Your KYC submission has been completed.",
    },
    // ... other stages
  ],
};

Flutter

final settings = {
  // ... other settings
  "stages": [
    {
      "name": "complete",
      "heading": "Thank you!",
      "message": "Your KYC submission has been completed.",
    },
    // ... other stages
  ],
};

Cordova

const settings = {
  // ... other settings
  stages: [
    {
      name: "complete",
      heading: "Thank you!",
      message: "Your KYC submission has been completed.",
    },
    // ... other stages
  ],
};