Intégration guidée par les vérifications

Créez des parcours KYC et de vérification d’identité pilotés par les contrôles dans les applications React Native.

Vue d'ensemble

Ce guide vous guide à travers l’intégration du SDK React Native avec ComplyCube en utilisant l’approche basée sur les contrôles, vous donnant un contrôle direct sur les étapes de vérification individuelles.

Vous consultez le piloté par des vérifications guide SDK - une approche qui offre un contrôle détaillé mais qui convient mieux aux partenaires ou cas d’utilisation avancés. Nous recommandons d’utiliser l’intégration des flux de travail pour la plupart des implémentations.

Flux d'intégration

Le SDK mobile s’exécute dans votre application mobile, mais s’appuie sur votre backend pour créer des jetons sécurisés. Voici comment cela fonctionne :

Créer un client

Enregistrez un nouveau client (c.-à-d. client) à l’aide de l’API ComplyCube.

Générez un jeton SDK

Votre backend demande un jeton JWT lié à ce client.

Initialisez le SDK dans votre application mobile

Passez le jeton et les paramètres à l’initialiseur du SDK.

Capturez des documents, des vidéos et des selfies

Le SDK guide votre client à travers les étapes requises.

Effectuez des vérifications

Les données capturées sont envoyées en toute sécurité à ComplyCube pour les vérifications, et les résultats sont fournis en temps réel via l’API ou les webhooks.

Guide d'intégration

Explorez le code source et les projets d’exemple dans notre dépôt : .

Installer le SDK

Installez la bibliothèque React Native en exécutant :

npm i -s @complycube/react-native

Suivez les étapes dans les iOS et Android onglets.

Intégration de Sentry

Si vous intégrez Sentry dans votre projet React Native, vous pouvez rencontrer l’erreur de compilation suivante :

Le fichier « SentryDefines.h » est introuvable.

Ce problème survient en raison d’une incompatibilité de version entre le package Sentry React Native et le SDK Sentry natif.

Pour résoudre cette erreur (à partir de @sentry/react-native v5.31.0 et iOS Sentry v8.36.0), mettez à jour les instructions d’import dans votre code.

Dans SentrySdkInfo.h et SentryInternalSerializable.h, remplacez :

// Remplacez
#import "SentryDefines.h"

// Par
#import <Sentry/SentryDefines.h>

Avant d’utiliser le SDK ComplyCube, installez le CocoaPods plugin en exécutant la commande suivante dans votre terminal :
```
sudo gem install cocoapods
```

Ajoutez les dépôts du plugin et installez le pod en utilisant votre Podfile:

source 'https://github.com/CocoaPods/Specs.git'
…
platform :iOS, ’13.0’

target ‘YourApp’ do
    …
  pod 'ComplyCubeMobileSDK'
end

post_install do |installer|
    installer.pods_project.targets.each do |target|
        target.build_configurations.each do |build_configuration|
            build_configuration.build_settings['ENABLE_BITCODE'] = 'NO'
            build_configuration.build_settings['BUILD_LIBRARY_FOR_DISTRIBUTION'] = 'YES'
            build_configuration.build_settings['IPHONEOS_DEPLOYMENT_TARGET'] = '13.1'
            build_configuration.build_settings['ARCHS'] = ['$(ARCHS_STANDARD)', 'x86_64']
            build_configuration.build_settings['EXCLUDED_ARCHS[sdk=iphonesimulator*]'] = ['arm64', 'arm64e', 'armv7', 'armv7s']
            build_configuration.build_settings['GENERATE_INFOPLIST_FILE'] = 'YES'
        end
    end
end

Autorisations de l’application

Notre SDK utilise la caméra et le microphone de l’appareil pour la capture. Vous devez ajouter les clés suivantes à votre application Info.plist fichier.

NSCameraUsageDescription

<key>NSCameraUsageDescription</key>
<string>Utilisé pour capturer des données biométriques faciales et des documents</string>

NSMicrophoneUsageDescription

<key>NSMicrophoneUsageDescription</key>
<string>Utilisé pour capturer des données biométriques vidéo</string>

Notre SDK nécessite les dépôts ci-dessous.

repositories {
  mavenCentral()
}

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

Créer un client

Chaque parcours de vérification commence par un client (c.-à-d. le client). Utilisez l’API pour créer le client.

Cela doit être fait sur votre backend de l’application mobile serveur, et non dans l’application mobile elle-même.

Exemple de requête

curl -X POST https://api.complycube.com/v1/clients \
     -H 'Authorization: <YOUR_API_KEY>' \
     -H 'Content-Type: application/json' \
     -d '{
          "type": "person",
          "email": "john.doe@example.com",
          "personDetails":{
               "firstName": "John",
               "lastName" :"Doe"
          }
        }'

const { ComplyCube } = require("@complycube/api");

const complycube = new ComplyCube({ apiKey: "<YOUR_API_KEY>" });

const client = await complycube.client.create({
  type: "person",
  email: "john.doe@example.com",
  personDetails: {
    firstName: "John",
    lastName: "Doe"
  }
});

from complycube import ComplyCubeClient
cc_api = ComplyCubeClient(api_key='<YOUR_API_KEY>')

new_client = {
    'type':'person',
    'email':'john.doe@example.com',
    'personDetails': {
        'firstName':'John',
        'lastName':'Doe'
    }
}

client = cc_api.clients.create(**new_client)

use ComplyCube\ComplyCubeClient;

$ccapi = new ComplyCubeClient('<YOUR_API_KEY>');

$result = $ccapi->clients()->create([
    'type' => 'person',
    'email' => 'john@doe.com',
    'personDetails' => [
        'firstName' => 'John',
        'lastName' => 'Doe'
    ]
]);

using ComplyCube.Net;
using ComplyCube.Net.Resources.Clients;

var clientApi = new ClientApi(new ComplyCubeClient("<YOUR_API_KEY>"));
var newClient = new ClientRequest {
  type = "person",
  email = "john@doe.com",
  personDetails = new PersonDetails {
    firstName = "John",
    lastName = "Doe"
  }
}

var client = await clientApi.CreateAsync(newClient);

Exemple de réponse

La réponse contiendra un id (l’ID du client). Il est requis pour l’étape suivante.

{
    "id": "5eb04fcd0f3e360008035eb1",
    "type": "person",
    "email": "john.doe@example.com",
    "personDetails": {
        "firstName": "John",
        "lastName": "Doe"
    },
    "createdAt": "2020-01-04T17:24:29.146Z",
    "updatedAt": "2020-01-04T17:24:29.146Z"
}

Voir Référence de l’API Clients pour en savoir plus.

Générez un jeton SDK

Votre backend doit créer un jeton SDK pour chaque nouveau flux. Ce jeton permet aux clients d’envoyer des données personnelles en toute sécurité depuis votre application mobile vers ComplyCube.

Les jetons ont une courte durée de vie et ne doivent pas être réutilisés.

Exemple de requête

curl -X POST https://api.complycube.com/v1/tokens \\
     -H 'Authorization: <YOUR_API_KEY>' \\
     -H 'Content-Type: application/json' \\
     -d '{
           "clientId":"CLIENT_ID",
           "appId": "com.complycube.SampleApp"
         }'

const { ComplyCube } = require("@complycube/api");

const complycube = new ComplyCube({ apiKey: "<YOUR_API_KEY>" });

const token = await complycube.token.generate("CLIENT_ID", {
    appId: "com.complycube.SampleApp"
});

from complycube import ComplyCubeClient

cc_api = ComplyCubeClient(api_key='<YOUR_API_KEY>')

token = cc_api.tokens.create('CLIENT_ID', appId='com.complycube.SampleApp')

using ComplyCube.Net;
using ComplyCube.Net.Resources.SDKTokens;

var sdkTokenApi = new SDKTokenApi(new ComplyCubeClient("<YOUR_API_KEY>"));

var sdkTokenRequest = {
  clientId = "CLIENT_ID",
  appId = "com.complycube.SampleApp"
}

var sdkToken = await sdkTokenApi.GenerateToken(sdkTokenRequest);

Exemple de réponse

{
    "token": "<CLIENT_TOKEN>"
}

Voir Référence de l'API du jeton SDK pour en savoir plus.

Préparez les étapes

Configurez les étapes que vous souhaitez inclure dans votre flux.

const stages = [
  {
    name: "intro",
    heading: "Vérification d’identité Green Bank",
  },
  {
    name: "documentCapture",
    showGuidance: false,
    useMLAssistance: true,
    retryLimit: 1,
    documentTypes: {
      passport: true,
      driving_license: ["GB", "FR"],
    },
  },
  "faceCapture",
];

Initialiser le SDK

Vous pouvez maintenant initialiser un flux. La séquence d’étapes que vous spécifiez détermine l’ordre dans lequel votre client voit ces étapes.

import { ComplyCube } from "@complycube/react-native";
// ...

const settings = {
  clientID: "<CLIENT_ID>",
  clientToken: "<CLIENT_TOKEN>",
  stages: stages,
  // ... autres paramètres
};

return (
  <View style={styles.container}>
    <ComplyCube settings={settings} />
  </View>
);

Effectuer des vérifications

À l’aide des résultats renvoyés dans le onSuccess callback, vous pouvez déclencher votre backend mobile afin d’exécuter les contrôles nécessaires sur votre client.

Par exemple, utilisez le résultat d’une capture de selfie et de document comme suit :

result.documentId pour lancer une Contrôle du document.
result.documentId et result.livePhotoId pour lancer une Contrôle d’identité.

Exemple de requête pour un contrôle du document

curl -X POST https://api.complycube.com/v1/checks \
     -H 'Authorization: <YOUR_API_KEY>' \\
     -H 'Content-Type: application/json' \\
     -d '{
            "clientId":"CLIENT_ID",
            "type": "document_check",
            "documentId":"DOCUMENT_ID"
         }'

const { ComplyCube } = require("@complycube/api");

const complycube = new ComplyCube({ apiKey: "<YOUR_API_KEY>" });

const check = await complycube.check.create("CLIENT_ID", {
    type: "document_check",
    documentId: "DOCUMENT_ID"
});

from complycube import ComplyCubeClient

cc_api = ComplyCubeClient(api_key='<YOUR_API_KEY>')

check = cc_api.checks.create(
    "CLIENT_ID", 
    "document_check", 
    documentId="DOCUMENT_ID"
)

use ComplyCube\ComplyCubeClient;

$ccapi = new ComplyCubeClient('<YOUR_API_KEY>');

$result = $ccapi->checks()->create('CLIENT_ID', [
    'type' => 'document_check',
    'documentId' => 'DOCUMENT_ID'
]);

using ComplyCube.Net;
using ComplyCube.Net.Resources.Checks;

var checkApi = new CheckApi(new ComplyCubeClient("<YOUR_API_KEY>"));

var checkRequest = new CheckRequest {
  clientId = "CLIENT_ID",
  type = "document_check",
  documentId = "DOCUMENT_ID"
};

var check = await checkApi.CreateAsync(checkRequest);

Si vous avez configuré des webhooks comme décrit dans notre guide des webhooks, vous serez informé lorsqu'une vérification sera terminée.

Pour récupérer les résultats de la vérification, vous pouvez effectuer une requête GET requête de vérification.

Récupérer les résultats de vérification

Votre backend mobile peut récupérer tous les résultats de contrôle à l’aide de notre API.

Tous nos contrôles sont asynchrones. Si vous avez configuré des webhooks comme décrit dans notre guide des webhooks, vous serez informé lorsqu'une vérification sera terminée.

Pour récupérer les résultats de la vérification, vous pouvez effectuer une requête GET requête de vérification.

Exemple de requête

curl -X GET https://api.complycube.com/v1/checks/{:checkId} \\
     -H 'Authorization: <YOUR_API_KEY>'

const { ComplyCube } = require("@complycube/api");

const complycube = new ComplyCube({ apiKey: "<YOUR_API_KEY>" });

const check = await complycube.check.get("CHECK_ID");

using ComplyCube.Net;
using ComplyCube.Net.Resources.Checks;

var checkApi = new CheckApi(new ComplyCubeClient("<YOUR_API_KEY>"));

var check = await checkApi.GetAsync("CHECK_ID");

Étapes

Chaque étape du flux peut être personnalisée pour créer le parcours idéal pour vos clients.

L’extrait ci-dessous montre comment configurer un flux personnalisé à l’aide du SDK mobile ComplyCube.

const stages = [
  {
    name: 'intro',
    // ... autres paramètres
  },
  {
    name: "consent",
    // ... autres paramètres
  },
  {
    name: 'documentCapture',
    // ... autres paramètres
  },
  {
    name: "faceCapture",
    // ... autres paramètres
  },
  {
    name: "poaCapture",
    // ... autres paramètres
  },
  {
    name: "complete",
    // ... autres paramètres
  }
];

const settings = {
  clientID: "CLIENT_ID",
  clientToken: "SDK_TOKEN",
  stages: stages,
  language: "en",
  lookAndFeel: {/*...*/}
}

<ComplyCube
  settings={settings} 
  onSuccess={/*...*/} 
  onCancel={/*...*/}
  onError={/*...*/}
  onEventCallback={/*...*/}
/>

Bienvenue

L’écran de bienvenue est toujours affiché en premier dans le processus de vérification. Il affiche un message de bienvenue ainsi qu’un résumé des étapes configurées que l’utilisateur devra compléter.

Vous pouvez personnaliser le titre de l’écran pour l’aligner sur le ton et l’identité visuelle de votre application.

const settings = {
  // ... autres paramètres
  stages: [
    {
      name: "intro",
      heading: "Titre d’écran personnalisé",
      message: "Message de bienvenue personnalisé.",
    },
    // ... autres étapes
  ],
};

Consentement

Cette étape sert à recueillir le consentement explicite de l’utilisateur avant de poursuivre le flux de vérification. Elle vous aide à répondre aux exigences réglementaires et de conformité, le cas échéant.

Vous pouvez personnaliser le titre de l’écran et le message pour les adapter à vos besoins juridiques ou à votre identité de marque.

const settings = {
  // ... autres paramètres
  stages: [
    {
      name: "consent",
      heading: "Titre d’écran de consentement personnalisé"
    },
    // ... autres étapes
  ],
};

Photo et vidéo de selfie

Vous pouvez demander soit une photo selfie (c.-à-d. une Photo en direct) ou une vidéo selfie (c.-à-d. une Vidéo en direct) du client dans le cadre du processus de vérification biométrique.

Photo: Capture une image fixe et effectue une vérification passive de la vivacité avant d’autoriser l’envoi.
Vidéo: Enregistre une courte vidéo où l’utilisateur effectue un défi affiché à l’écran (par ex. un mouvement de tête ou une phrase à prononcer).

Si vous essayez d’ajouter les deux types d’étapes, le SDK lèvera une ComplyCubeErrorCode.BiometricStageCount erreur indiquant la présence de plusieurs étapes incompatibles.

const settings = {
  // ... autres paramètres
  stages: [
    {
      name: "faceCapture",
      mode: "photo",
      // Activez l’assistance ML pendant la capture
      useMLAssistance: false,
    },
    // ... autres étapes
  ],
};

const settings = {
  // ... autres paramètres
  stages: [
    {
      name: "faceCapture",
      mode: "video",
      // Activez l’assistance ML pendant la capture
      useMLAssistance: false,
    },
    // ... autres étapes
  ],
};

Document

L’étape Document permet aux utilisateurs de sélectionner et de capturer un document d’identité à des fins de vérification (par exemple, passeport, carte d’identité, permis de séjour). Vous pouvez personnaliser ces écrans pour :

Limiter la portée des types de documents que le client peut sélectionner, par exemple, passeport uniquement.
Définir les pays émetteurs de documents autorisés pour chaque type de document.
Ajouter ou supprimer la capture automatisée à l’aide d’une assistance intelligente.
Afficher ou masquer les écrans d’instructions avant la capture.
Définir une limite de tentatives afin de permettre aux clients de poursuivre le parcours, quelle que soit la qualité de la capture.

Si vous fournissez un seul type de document, l’écran de sélection du type de document sera ignoré. L’écran de sélection du pays sera ignoré si vous fournissez un seul pays pour un type de document donné.

Vous pouvez contrôler si des écrans d’instructions sont affichés avant chaque capture par caméra en activant ou en désactivant le mode d’assistance. Ne désactivez le mode d’assistance que si vos utilisateurs sont déjà clairement informés des étapes de capture, car ces écrans contribuent à réduire les erreurs des utilisateurs et à améliorer la qualité de la capture.

Veuillez noter que le retryLimit que vous définissez ici aura priorité sur la limite de tentatives qui a été définie globalement dans vos paramètres d’automatisation.

const settings = {
  // ... autres paramètres
  stages: [
    {
      name: "documentCapture",

      // Activez ou désactivez des conseils supplémentaires pour l’utilisateur
      showGuidance: false,

      // Activez l’assistance ML pendant la capture
      useMLAssistance: true,

      // Définissez un maximum de tentatives de contrôle qualité avant l’envoi
      retryLimit: 1,

      // Activez ou désactivez la possibilité de téléverser une image depuis un fichier
      liveCapture: false,

      // Définissez les types de documents et limitez les pays activés
      documentTypes: {
        passport: true,
        driving_license: ["GB", "US"],
      },
    },
    // ... autres étapes
  ],
};

Capture NFC

Le SDK mobile ComplyCube prend en charge la lecture basée sur la NFC puce RFID des documents d'identité équipés de puces intégrées. Cela permet une extraction sécurisée des données et une authentification documentaire hautement fiable.

Veuillez contacter votre Responsable de compte ou service d’assistance pour accéder à notre SDK mobile compatible NFC.

Prérequis

Pour utiliser cette fonctionnalité, votre application doit avoir la Lecture des balises Near Field Communication capacité activée. Pour ajouter cette capacité à votre application, reportez-vous à au guide d'Apple ici.

Installez le CocoaPods Artifactory plugin en exécutant la commande suivante dans votre terminal :
```
gem install cocoapods-art
```
Pour ajouter la bibliothèque, copiez les identifiants de votre dépôt dans un .netrc fichier dans votre répertoire personnel et configurez le dépôt :
```
pod repo-art add cc-cocoapods-release-local "https://complycuberepo.jfrog.io/artifactory/api/pods/cc-cocoapods-release-local"
```
N'oubliez pas de récupérer vos identifiants depuis JFrog en utilisant le Set Me Up bouton ici.

Ajoutez les dépôts du plugin et installez le pod à l'aide de votre Podfile:

 plugin 'cocoapods-art', :sources => [
   'cc-cocoapods-release-local',
   'trunk'
 ]
 ...
 platform :ios, '13.0' # Ou supérieur

 target 'YourApp' do
   use_frameworks!
   use_modular_headers!
   ...
   pod 'ComplyCubeMobileSDK', '2.0.x-nfc'
   ...
 en

Vous devez ajouter les clés suivantes à votre application Info.plist fichier :
```
<key>NFCReaderUsageDescription</key>
<string>Nécessaire pour lire des documents compatibles NFC</string>
```

Pour lire correctement les balises NFC, vous devez ajouter les entrées suivantes à la cible de votre application Info.plist fichier :

<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>
  <string>E80704007F00070302</string>
  <string>A000000167455349474E</string>
  <string>A00000045645444C2D3031</string>
</array>

Ajoutez ce qui suit dans votre Runner.entitlements fichier :
```
<key>com.apple.developer.nfc.readersession.formats</key>
<array><string>TAG</string></array>
```
Pour activer NFC lors de la compilation de votre application iOS, transmettez la USE_CCNFC variable d'environnement pendant la compilation :
```
USE_CCNFC=true flutter build ios
```
Pour conserver cette option activée pour toutes les compilations iOS, ajoutez la ligne suivante en haut de votre ios/Podfile:
```
ENV['USE_CCNFC'] ||= 'true'
```

Commencez par ajouter vos identifiants d’accès au dépôt du SDK ComplyCube compatible NFC dans le gradle.properties fichier de votre application mobile:

USE_NFC=true
artifactory_contextUrl=https://complycuberepo.jfrog.io/artifactory/cc-gradle-release
artifactory_user=<YOUR_USERNAME>
artifactory_password=<YOUR_PASSWORD>

Remplacez <YOUR_USERNAME> et <YOUR_PASSWORD> par vos identifiants Artifactory ComplyCube. Si vous n’avez pas accès, contactez le support ComplyCube pour demander des identifiants.

Ensuite, mettez à jour le fichier de niveau projet build.gradle ou build.gradle.kts avec les paramètres Maven du dépôt du SDK ComplyCube :

repositories {
    google()
    mavenCentral()
    maven {
        url project.findProperty("artifactory_contextUrl")
        credentials {
            username = project.findProperty("artifactory_user")
            password = project.findProperty("artifactory_password")
        }
    }
}

repositories {
    google()
    mavenCentral()
    maven {
        url = uri(project.findProperty("artifactory_contextUrl") as String)
        credentials {
            username = project.findProperty("artifactory_user") as String?
            password = project.findProperty("artifactory_password") as String?
        }
    }
}

Activation de la capture NFC

const settings = {
    // ... autres paramètres
    stages : [
      {
        name: 'documentCapture',
        // Ajoutez cette propriété pour activer NFC
        nfcEnabled: true
        ...
      },
      // ... autres étapes
    ]
}

Capture d’adresse

Cette étape permet aux utilisateurs de saisir manuellement leur adresse résidentielle. Vous pouvez la personnaliser pour :

Restreindre la saisie à des pays spécifiques
Activer ou désactiver la fonction de saisie semi-automatique de l’adresse pour une saisie plus rapide et plus précise

const settings = {
  // ... autres paramètres
  stages: [
    {
      name: "addressCapture",

      // Cela active notre fonctionnalité de saisie semi-automatique d’adresse
      useAutoComplete: false,
      
      // Liste des pays acceptables pour la capture d’adresse
      allowedCountries: ['GB','US']
    },
    // ... autres étapes
  ],
};

Justificatif de domicile

Cette étape permet aux clients de soumettre un document vérifiant leur adresse de résidence. Vous pouvez configurer les types de documents acceptés, comme les factures de services publics ou les relevés bancaires, et choisir si les clients peuvent téléverser un fichier ou doivent capturer le document en direct à l’aide de la caméra de leur appareil.

Par défaut, cette étape inclut le étape de capture de l’adresse avec l’autocomplétion activée pour aider les utilisateurs lors de la saisie. L’autocomplétion peut être désactivée si elle n’est pas nécessaire.

const settings = {
  // ... autres paramètres
  stages: [
    {
      name: "poaCapture",

      // Lorsqu’elle est désactivée, le client sera contraint d’effectuer une capture en direct
      liveCapture: false,
    },
    // ... autres étapes
  ],
};

Finalisation

Vous pouvez inclure une étape de finalisation à la fin du flux afin de confirmer que le processus s’est terminé avec succès. Cet écran offre à l’utilisateur un point de fin clair et peut être personnalisé pour afficher un message de confirmation ou les étapes suivantes.

const settings = {
  // ... autres paramètres
  stages: [
    {
      name: "complete",
      heading: "Merci !",
      message: "Votre soumission KYC a été complétée.",
    },
    // ... autres étapes
  ],
};

Branding

Le SDK vous permet de personnaliser l’interface utilisateur pour l’aligner sur l’identité visuelle de votre application. Vous pouvez définir les couleurs principales et d’accentuation lors de la configuration afin d’aligner le flux de vérification sur les lignes directrices de votre marque. En savoir plus sur nos propriétés d’apparence (voir ci-dessous).

const settings = {
  // ...
  lookAndFeel: {
    // Couleur d’arrière-plan du bouton d’action principal
    primaryButtonBgColor: "#FFFFFF",

    // Forcez le SDK en mode 'dark', 'light' ou 'inherit'
    uiInterfaceStyle: "dark",
  },
};

Propriétés d’apparence

Propriété d’apparence

Description

primaryButtonBgColor

Couleur d’arrière-plan du bouton d’action principal.

primaryButtonTextColor

Couleur du texte du bouton d’action principal.

primaryButtonBorderColor

Couleur de la bordure du bouton d’action principal.

secondaryButtonBgColor

Couleur d’arrière-plan du bouton secondaire.

secondaryButtonPressedBgColor

Couleur d’arrière-plan du bouton d’action secondaire enfoncé. Non pris en charge par Android.

secondaryButtonTextColor

Couleur du texte du bouton d’action secondaire.

secondaryButtonBorderColor

Couleur de la bordure du bouton d’action secondaire.

documentTypeSelectorBgColor

Couleur du bouton de sélection du type de document.

documentTypeSelectorBorderColor

Couleur de la bordure du bouton de sélection du type de document.

documentTypeSelectorTitleTextColor

Couleur du texte du titre de la sélection du type de document.

documentTypeSelectorDescriptionTextColor

Couleur du texte de description de la sélection du type de document.

documentTypeSelectorIconColor

Couleur de l’icône de sélection du type de document.

bodyTextColor

Couleur du texte du corps de l’écran.

linkButtonTextColor

Couleur des liens. Non pris en charge par Android.

headingTextColor

Couleur du texte du titre.

subheadingTextColor

Couleur du texte du sous-titre.

infoPanelTitleColor

Couleur du titre du panneau d’informations.

infoPanelDescriptionTextColor

Couleur du texte de description du panneau d’informations.

infoPanelBgColor

Couleur d’arrière-plan du panneau d’informations.

infoPanelIconColor

Couleur de l’icône du panneau d’informations.

errorPanelTitleColor

Couleur du titre du panneau d’erreur.

errorPanelDescriptionTextColor

Couleur du texte de description du panneau d’erreur.

errorPanelBgColor

Couleur d’arrière-plan du panneau d’erreur.

errorPanelIconColor

Couleur de l’icône du panneau d’erreur.

cameraButtonBgColor

Couleur d’arrière-plan du bouton de capture de la caméra.

uiInterfaceStyle

Définissez le SDK pour utiliser le mode sombre, le mode clair ou l’héritage du système.

Localisation

Le SDK prend en charge plusieurs langues, notamment celles énumérées ci-dessous.

Arabe - ar 🇦🇪
Chinois (simplifié) - zh 🇨🇳
Chinois (traditionnel) - hk 🇨🇳
Néerlandais - nl 🇳🇱
Anglais - en 🇺🇸
Français - fr 🇫🇷
Allemand - de 🇩🇪
Hindi - hi 🇮🇳
Indonésien - identifiant 🇮🇩
Italien - it 🇮🇹

Japonais - ja 🇯🇵
Coréen - ko 🇰🇷
Norvégien - no 🇳🇴
Polonais - po 🇵🇱
Portugais - pt 🇵🇹
Espagnol - es 🇪🇸
Suédois - sv 🇸🇪
Thaï - th 🇹🇭
Vietnamien - vi 🇻🇳
et plus encore...

Gestion des résultats

Pour exécuter les contrôles de vérification, vous devez implémenter les succès, annulé, et erreur callbacks.

En cas d’achèvement réussi (onSuccess), vous pouvez déclencher des requêtes de vérification depuis votre backend en utilisant les identifiants de ressource renvoyés dans l’objet résultat. Ces identifiants correspondent aux éléments téléversés (par ex. documents, selfies) et peuvent être utilisés pour lancer des contrôles de vérification via l’API ComplyCube.

Si l’utilisateur quitte le flux avant la fin, le onCancelled callback est appelée avec une raison descriptive indiquant pourquoi la session a été annulée (par ex. sortie de l’utilisateur, délai d’attente, autorisation refusée)

Dans certains cas, le client peut annuler le flux après avoir terminé une ou plusieurs étapes de capture. Si cela se produit, toutes les données capturées avant l’annulation, comme des documents ou des médias biométriques, peuvent déjà avoir été téléversées vers son dossier client.

Si le SDK rencontre un problème, le onError callback est déclenchée avec un ComplyCubeError objet contenant le type d’erreur et le message. Consultez les codes d’erreur (voir ci-dessous) pour une liste complète des cas d’erreur possibles.

function onSuccess(results){
  /*
    Gestion des résultats réussis :
    Notre flux par défaut comprend trois composants : un document d’identité,
    un selfie (photo en direct) et un justificatif de domicile. En cas de 
    réussite, le paramètre 'results' contiendra : 
      - "documentIds": ["xxxxx"]
      - "livePhotoIds": ["xxxxx"]
      - "poaIds": ["xxxxxx"]
  */
  console.log(results);
}

function onCancelled(){
  console.log("L’utilisateur a annulé");
}

function onError(error){
  console.log(error);
}

return(<View>
    <ComplyCube 
      settings={settings}
      onSuccess={onSuccess}
      onCancel={onCancelled}
      onError={onError}
       />
  </View>
)

Codes d’erreur

Type d'erreur

Description

Nombre d'étapes biométriques

La configuration contient des doublons photo de selfie ou vidéo selfie étapes.

Annulé

Le client a annulé le flux et quitté le SDK (a déclenché le onCancelled callback).

Connectivité

Une erreur réseau s'est produite.

Document obligatoire

Un étape de document est requise en fonction des étapes configurées, mais n'a pas été incluse.

Jeton expiré

Le jeton du SDK a expiré. Générez un nouveau jeton et redémarrez le flux.

Erreur de flux

Une erreur irrécupérable s'est produite pendant le flux.

Code pays invalide

Un code pays invalide a été fourni.

Jailbroken

Le SDK ne peut pas s'exécuter sur cet appareil car il a été jailbreaké ou compromis.

Aucun accès au disque

Le client a refusé les autorisations d'accès au disque requises par le SDK.

Aucun type de document

Un étape de document a été initialisé sans spécifier de types de document.

Aucun résultat

Aucun résultat n'a été renvoyé au rappel. Si cela persiste, veuillez contacter l'assistance.

Aucun consentement de l'utilisateur

Le client n'a pas fourni son consentement pour poursuivre le flux du SDK.

Non autorisé

Le SDK a tenté d'accéder à un point de terminaison qu'il n'est pas autorisé à utiliser.

Inconnu

Une erreur inattendue s'est produite. Si cela se reproduit régulièrement, contactez l'assistance.

Combinaison pays/type de document non prise en charge

La combinaison sélectionnée de pays et de type de document n'est pas prise en charge.

Type de document non pris en charge

Le type de document fourni n'est pas pris en charge.

Erreur de téléversement

Une erreur est survenue lors du téléversement d'un document ou d'un selfie.

Téléversement nécessitant une assistance

Si useLiveCaptureOnly est défini sur false, l'assistance doit être activée en définissant isGuidanceEnabled à true.

Suivi des événements

Le SDK suit une gamme de événements tout au long du parcours de vérification, couvrant toutes les interactions clés des utilisateurs à chaque étape. Consultez ci-dessous la liste des événements.

Si vous devez mettre en œuvre des analyses personnalisées, vous pouvez vous raccorder à ces événements et déclencher en conséquence votre propre logique de suivi.

Pour intégrer votre propre suivi, définissez une fonction et appliquez-la à l’aide de la eventHandler propriété dans vos paramètres:

function myCustomEventHandler(event){
  // Insérez ici le code de suivi utilisateur personnalisé
  console.log(event.code);
  console.log(event.message);
}

const settings = {
  eventHandler: myCustomEventHandler,
  // ... autres paramètres
}

Événements

Événement

INTRODUCTION Le client a atteint l'écran d'introduction.

ÉTAPE_DE_CONSENTEMENT Le client a atteint l'écran de consentement.

AVERTISSEMENT_ÉTAPE_DE_CONSENTEMENT Le client a tenté de quitter sans donner son consentement.

AUTORISATION_D'ACCÈS_À_LA_CAMÉRA Le client a atteint l'écran de demande d'autorisation de la caméra.

ÉTAPE_GUIDE_DE_CAPTURE_DE_DOCUMENT Le client a atteint l'écran de guide de capture de document.

ÉTAPE_TYPE_DE_DOCUMENT Le client a atteint l'écran de sélection du type de document pour une capture de document.

ÉTAPE_SÉLECTION_DU_PAYS Le client a atteint l'écran de sélection du pays pour une capture de document.

ÉTAPE_DOCUMENT_À_UNE_FACE_CAMÉRA Le client a atteint l'étape de capture par caméra pour un document d'identité à une face.

ÉTAPE_DOCUMENT_À_UNE_FACE_CAMÉRA_MODE_MANUEL Le client a atteint l'écran de capture manuelle par caméra pour un document d'identité à une face.

ÉTAPE_DOCUMENT_À_UNE_FACE_VÉRIFICATION_QUALITÉ Le client a atteint l'écran d'aperçu de qualité pour un document d'identité à une face.

ÉTAPE_DOCUMENT_FACE_AVANT_CAMÉRA Le client a atteint l'écran de capture par caméra pour la face avant d'un document d'identité à deux faces.

ÉTAPE_DOCUMENT_FACE_AVANT_CAMÉRA_MODE_MANUEL Le client a atteint l'écran de capture manuelle par caméra pour la face avant d'un document d'identité à deux faces.

ÉTAPE_DOCUMENT_FACE_AVANT_VÉRIFICATION_QUALITÉ Le client a atteint l'écran d'aperçu de qualité pour la face avant d'un document d'identité à deux faces.

ÉTAPE_DOCUMENT_FACE_ARRIÈRE_CAMÉRA Le client a atteint l'écran de capture par caméra pour la face arrière d'un document d'identité à deux faces.

ÉTAPE_DOCUMENT_FACE_ARRIÈRE_CAMÉRA_MODE_MANUEL Le client a atteint l'écran de capture manuelle par caméra pour la face arrière d'un document d'identité à deux faces.

ÉTAPE_DOCUMENT_FACE_ARRIÈRE_VÉRIFICATION_QUALITÉ Le client a atteint l'écran d'aperçu de qualité pour la face arrière d'un document d'identité à deux faces.

ÉTAPE_BIOMÉTRIE_GUIDE_DE_CAPTURE_DE_SELFIE Le client a atteint l'écran de guide de capture de selfie.

ÉTAPE_BIOMÉTRIE_CAMÉRA_SELFIE Le client a atteint l'écran de capture photo de selfie par caméra.

ÉTAPE_BIOMÉTRIE_CAMÉRA_SELFIE_MODE_MANUEL Le client a atteint l'écran de capture photo de selfie manuelle par caméra.

ÉTAPE_BIOMÉTRIE_VÉRIFICATION_QUALITÉ_SELFIE Le client a atteint l'écran de prévisualisation de la photo de selfie.

ÉTAPE_BIOMÉTRIE_CAMÉRA_VIDÉO Le client a atteint l'écran de caméra de selfie vidéo.

ÉTAPE_BIOMÉTRIE_CAMÉRA_VIDÉO_MODE_MANUEL Le client a atteint l'écran de capture manuelle par caméra pour un selfie vidéo.

ÉTAPE_BIOMÉTRIE_PREMIÈRE_ACTION_VIDÉO Le client a atteint la première action d'une capture de selfie vidéo.

ÉTAPE_BIOMÉTRIE_DEUXIÈME_ACTION_VIDÉO Le client a atteint la deuxième action d'une capture de selfie vidéo.

ÉTAPE_BIOMÉTRIE_VÉRIFICATION_QUALITÉ_VIDÉO Le client a atteint l'écran de capture manuelle par caméra pour un selfie vidéo.

ÉTAPE_GUIDE_DE_CAPTURE_DU_JUSTIFICATIF_DE_DOMICILE Le client a atteint l'écran de guide de capture du justificatif de domicile.

ÉTAPE_JUSTIFICATIF_DE_DOMICILE_TYPE_DE_DOCUMENT Le client a atteint l'écran de sélection du type de document pour une capture de justificatif de domicile.

ÉTAPE_JUSTIFICATIF_DE_DOMICILE_SÉLECTION_DU_PAYS Le client a atteint l'écran de sélection du pays pour une capture de justificatif de domicile.

ÉTAPE_JUSTIFICATIF_DE_DOMICILE_À_UNE_FACE_CAMÉRA Le client a atteint l'étape de capture par caméra pour un justificatif de domicile à une face.

ÉTAPE_JUSTIFICATIF_DE_DOMICILE_À_UNE_FACE_CAMÉRA_MODE_MANUEL Le client a atteint l'étape de capture manuelle par caméra pour un justificatif de domicile à une face.

ÉTAPE_JUSTIFICATIF_DE_DOMICILE_À_UNE_FACE_VÉRIFICATION_QUALITÉ Le client a atteint l'écran d'aperçu de qualité pour un justificatif de domicile à une face.

ÉTAPE_JUSTIFICATIF_DE_DOMICILE_FACE_AVANT_CAMÉRA Le client a atteint l'étape de capture par caméra pour la face avant d'un justificatif de domicile à deux faces.

ÉTAPE_JUSTIFICATIF_DE_DOMICILE_FACE_AVANT_CAMÉRA_MODE_MANUEL Le client a atteint l'étape de capture manuelle par caméra pour la face avant d'un justificatif de domicile à deux faces.

ÉTAPE_JUSTIFICATIF_DE_DOMICILE_FACE_AVANT_VÉRIFICATION_QUALITÉ Le client a atteint l'écran d'aperçu de qualité pour la face avant d'un justificatif de domicile à deux faces.

ÉTAPE_JUSTIFICATIF_DE_DOMICILE_FACE_ARRIÈRE_CAMÉRA Le client a atteint l'étape de capture par caméra pour la face arrière d'un justificatif de domicile à deux faces.

ÉTAPE_JUSTIFICATIF_DE_DOMICILE_FACE_ARRIÈRE_CAMÉRA_MODE_MANUEL Le client a atteint l'étape de capture manuelle par caméra pour la face arrière d'un justificatif de domicile à deux faces.

ÉTAPE_JUSTIFICATIF_DE_DOMICILE_FACE_ARRIÈRE_VÉRIFICATION_QUALITÉ Le client a atteint l'écran d'aperçu de qualité pour la face arrière d'un justificatif de domicile à deux faces.

ÉTAPE_DE_FINALISATION Le client a atteint l'écran de fin.

Gestion de l’expiration du jeton

Pour gérer l’expiration du jeton de manière fluide, vous pouvez fournir une fonction de rappel qui génère un nouveau jeton SDK lorsque nécessaire. Cela permet au flux de se poursuivre sans interruption, sans que l’utilisateur ait à redémarrer la session manuellement.

function myCustomExpiryHandler(){
  // Insérez ici votre code personnalisé de renouvellement du jeton
}

const settings = {
  tokenExpiryHandler: myCustomExpiryHandler,
  // ... autres paramètres
}