Web Onboarding Commands

Alice Onboarding Web SDK can be used in two different ways, by commands (OnboardingCommands) or by full flow (Onboarding). The commands allow you to open the capturer and do a series of operations independently.

In this mode the process is completely free. Your application manages the beginning and end of it, as well as the capture and upload of the different documents to the API. This case is indicated for an expert level of configuration, allowing you to split the onboarding process into different stages and to get rid of intermediate screens.

Available operations are as follows:

• Get user status
• Get supported documents
• Add selfie
• Create document
• Add document
• Authenticate
• Add other trusted document

Configure environment

You need to configure the environment you want to use (you can choose between production or sandbox, so you need to check the API KEY related to each environment).

// The following line setups the environment for run the SDK
OnboardingCommands.setEnvironment(environment: "sandbox")

Initialize Onboarding Commands

If you don't know how to get the userToken please review the Authentication section.

Version >= 8.0.0Version < 8.0.0

let config = new aliceonboarding.OnboardingConfig().withCustomLocalization(
 { language: "en" }
);

let onboardingCommands = await OnboardingCommands.makeOnboardingCommands({
  idSelector: "alice-onboarding-mount",
  userToken: userToken,
  config: config
});

let config = new aliceonboarding.OnboardingConfig().withCustomLocalization(
  "en"
);

let onboardingCommands = await OnboardingCommands.makeOnboardingCommands(
  "alice-onboarding-mount",
  userToken,
  config
);

Get user status

It returns the Alice Onboarding User Status

• Parameter onSuccess: the callback that will be called when the user status is received.
• Parameter onError: the callback that will be called when there is an error.

onboardingCommands.getUserStatus(
  (userStatusResult) => {
    // onSuccess
    console.log(userStatusResult);
  },
  (error) => {
    //onError
    console.error(error);
  }
);

Get supported documents

It returns the Alice Onboarding supported documents (hierarchically sorted).

• Parameter onSuccess: the callback that will be called when the response is received.
• Parameter onError: the callback that will be called when there is an error.

Version >= 8.0.0Version < 8.0.0

onboardingCommands.getDocumentsSupported({
  onSuccess: (suportedDocuments) => {
    // onSuccess
    console.log(suportedDocuments);
  },
  onError: (error) => {
    //onError
    console.error(error);
  }
});

onboardingCommands.getDocumentsSupported(
  (suportedDocuments) => {
    // onSuccess
    console.log(suportedDocuments);
  },
  (error) => {
    //onError
    console.error(error);
  }
);

Add selfie

It presents an Alice Onboarding Selfie Capture View sending a video directly to Alice Onboarding platform.

• Parameter onSuccess: the callback that will be called when the selfie was added.

• Parameter onError: the callback that will be called when there is an error.

• Parameter onCancel: the callback that will be called when the user cancels the capture.

• Parameter SelfieStageConfig: (optional) see Selfie stage configuration parameters. Default configuration:

  • capturerType: SelfieCapturerType.CAMERA
  • selfieType: SelfieType.DEFAULT
  • automaticCapture: true
  • cameraType: CameraType.FACE

Warning

The parameter automaticCapture will disappear from version 8.0.0.

Note

Commands mode only admits the capturer SelfieCapturerType.CAMERA.

Version >= 8.0.0Version < 8.0.0

onboardingCommands.addSelfie({
  onSuccess: (successResult) => {
    // onSuccess
    console.log(successResult);
  },
  onError: (error) => {
    //onError
    console.error(error);
  },
  onCancel: (cancel) => {
    //onCancel
    console.error(cancel);
  },
  selfieStageConfig: new SelfieStageConfig({}),
});

onboardingCommands.addSelfie(
  (successResult) => {
    // onSuccess
    console.log(successResult);
  },
  (error) => {
    //onError
    console.error(error);
  },
  (cancel) => {
    //onCancel
    console.error(cancel);
  },
    new SelfieStageConfig(),
);

Create document

It creates a document given the type and the issuingCountry:

• Parameter documentType: DocumentType.
• Parameter issuingCountry: string value. You can check supported documents with the command getDocumentsSupported.
• Parameter onSuccess: the callback that will be called when the document is created.
• Parameter onError: the callback that will be called when an error occurs.

Note

On onSuccess returns a result with the document_id on the success content. This identifier (documentId) is necessary to add documents.

Version >= 8.0.0Version < 8.0.0

onboardingCommands.createDocument({
  documentType: DocumentType.IDCARD,
  issuingCountry: "ESP",
  onSuccess: (result) => {
    console.log(result.document_id); //returns the document id of the created document
  },
  onError (error) => {
    console.error(error);
  },
});

onboardingCommands.createDocument(
  DocumentType.IDCARD, //documentType
  "ESP", //issuingCountry
  (result) => {
    //onSuccess
    console.log(result.document_id); //returns the document id of the created document
  },
  (error) => {
    //onError
    console.error(error);
  },
);

Add document

It presents an Alice Onboarding Document Capture View sending images to Alice Onboarding platform

• Parameter onSuccess: the callback that will be called when the document was captured.
• Parameter onError: the callback that will be called when an error occurs.
• Parameter onCancel: this callback that will be called when the user cancels the capture.
• Parameter documentId: document identifier given by createDocument command.
• Parameter documentType: DocumentType.
• Parameter issuingCountry: string value. You can check supported documents with the command getDocumentsSupported.

• Parameter documentSide: string value. Side of the document (front or back).

• Parameter documentStageConfig: (optional) See Document stage configuration parameters. Default config:

  • capturerType: DocumentCapturerType.CAMERA.
  • automaticCapture: true.
  • cameraType: CameraType.BACK.

  Note

  Commands mode only admits the capturer DocumentCapturerType.CAMERA.

Version >= 8.0.0Version < 8.0.0

onboardingCommands.addDocument({
  onSuccess: (result) => {
    console.log(result);
  },
  onError: (error) => {
    console.error(error);
  },
  onCancel: (cancel) => {
    console.error(cancel);
  },
  documentId: result.document_id, //with the document_id of the previously created document, look at the previous command.
  documentType: DocumentType.IDCARD,
  issuingCountry: "ESP",
  documentSide: "front" //(front or back)
});

onboardingCommands.addDocument(
  (result) => {
    //onSuccess
    console.log(result);
  },
  (error) => {
    //onError
    console.error(error);
  },
  (cancel) => {
    //onCancel
    console.error(cancel);
  },
  result.document_id, //with the document_id of the previously created document, look at the previous command.
  DocumentType.IDCARD, //documentType
  "ESP", //issuingCountry
  "front" //documentSide  (front or back)
);

Add any document

In presents an Alice Onboarding Capture View that will detect automatically the type of document and send it directly to Alice Onboarding platform.

• Parameter onSuccess: the callback that will be called when the document was captured.
• Parameter onError: the callback that will be called when an error occurs.
• Parameter onCancel: this callback that will be called when the user cancels the capture.
• Parameter issuingCountry: to be able to recognize automatically the document, is mandatory to set up the issuing country (ESP/FRA).
• Parameter allowedTypes: list of allowed document types (idcard, driver license, residence permit, passport).

• Parameter documentStageConfig: It must be initialize with at least one parameter. See Document stage configuration parameters. Default config:

  • capturerType: DocumentCapturerType.CAMERA.
  • automaticCapture: true.
  • cameraType: CameraType.BACK.

Warning

Only available for the countries with support for this feature. At this moment France and Spain.

Version >= 8.0.0

let supportedIssuingCountry = "ESP" //FRA or ESP

//List of allowed DocumentTypes
let listOfAllowedTypes = [DocumentType.IDCARD, DocumentType.RESIDENCEPERMIT];


//Initialize with at least one parameter
const customDocumentStageConfig = new DocumentStageConfig({
  capturerType: DocumentCapturerType.CAMERA,
});

onboardingCommands.addAnyDocument({
  onSuccess: (successResult) => {
    console.log(successResult);
  },
  onError: (error) => {
    console.error(error);
  },
  onCancel: (cancel) => {
    console.error(cancel);
  },
  issuingCountry: supportedIssuingCountry,
  allowedTypes: listOfAllowedTypes,
  documentStageConfig: customDocumentStageConfig,
});

Authenticate

It presents an Alice Onboarding Authenticate Capture View sending a video directly to Alice Onboarding platform and checking if user is Login allowed or not.

Warning

The user must be already enrolled and authorized.

• Parameter onSuccess: the callback that will be called when the authentication is done.
• Parameter onError: the callback that will be called when an error occurs.
• Parameter onCancel: this callback that will be called when the user cancels the authentication.
• Parameter automaticCapture: flag to set automatic or manual capture (default value is true).
• Parameter cameraType: type of camera to use. The enum aliceonboarding.CameraType can be used to indicate the camera.

Default value is CameraType.FACE meaning that the camera facing the user will be used. You can set it to CameraType.BACK to use rear camera. This argument is only used when there are available different cameras on the device.

Version >= 8.0.0Version < 8.0.0

onboardingCommands.authenticate({
  onSuccess: (result) => {
          console.log(result)
      },
  onCancel: (cancel) => {
          console.error(cancel)
      }
  onError: (error) => {
          console.error(error)
      }
});

onboardingCommands.authenticate(
    (result) => { // onSuccess
        console.log(result)
    },
    (cancel) => { //onCancel
        console.error(cancel)
    }
    (error) => { //onError
        console.error(error)
    }
);

Add other trusted document

It presents an Alice Onboarding Other Trusted Document Capture View sending a PDF file to Alice Onboarding platform

• Parameter onSuccess: the callback that will be called when the document was captured.
• Parameter onError: the callback that will be called when an error occurs.
• Parameter onCancel: this callback that will be called when the user cancels the capture.
• Parameter category: this argument is required if your flow requires multiple documents. You must use this argument to tag each document, for example if your flow requires an invoice and a payslip you could use "invoice" and "payslip" as categories. Note: this argument is case insensitive.

Version >== 8.0.0Version < 8.0.0

onboardingCommands.addOtherTrustedDocument({
  onSuccess: (result) => {
    console.log(result);
  },
  onError: (error) => {
    console.error(error);
  },
  onCancel: (cancel) => {
    console.error(cancel);
  },
  category
});

onboardingCommands.addOtherTrustedDocument(
  (result) => {
    //onSuccess
    console.log(result);
  },
  (error) => {
    //onError
    console.error(error);
  },
  (cancel) => {
    //onCancel
    console.error(cancel);
  },
  category
);

Removing Alice Onboarding Commands

If you are running the onboarding commands mode, you can call the unmount method to cancel the capture. The first step is to initialize the Alice Command Mode as follows:

Version >= 8.0.0Version < 8.0.0

let onboardingCommands = new aliceonboarding.OnboardingCommands(
  idSelector: "alice-onboarding-mount",
  userToken,
  config
);

let onboardingCommands = new aliceonboarding.OnboardingCommands({
  "alice-onboarding-mount",
  userToken,
  config
});

When you want to unmount the Alice component you only have to call the following method:

onboardingCommands.unmount();

Onboarding client

Since version 4.30 in addition to the commands mode the class OnboardingClient is available allowing an easier integration for those integrators who want to consume the API directly. This class the following static methods:

Version >= 8.0.0Version < 8.0.0

static getStatus(userToken);
static createDocument({
  userToken,
  type,
  issuingCountry
});
static addDocument({
  userToken,
  documentId,
  image,
  side,
  manual,
  webcam,
  boundingBox
});
static addSelfie({
  userToken,
  video,
  start,
  duration,
  angle
});
static supportedDocuments(userToken);
static authenticate(userToken, video);
static authenticateFrames(userToken, frames);
static addOtherTrustedDocument({
  userToken,
  file,
  category
});
static unmount();

static getStatus(userToken);
static createDocument(userToken, type, issuingCountry);
static addDocument(userToken, documentId, image, side, manual, webcam, boundingBox);
static addSelfie(userToken, video, start, duration, angle);
static supportedDocuments(userToken);
static authenticate(userToken, video);
static authenticateFrames(userToken, frames);
static addOtherTrustedDocument(userToken, pdf, category);
static unmount();