Ionic Cordova

LTS version (Recommended for most users):	Current Version(Latest features)
1.4.2	1.3.0

Install MetaMap for Cordova

add target minimum version on the config.xml file

<preference name="deployment-target" value="12.0" />

add the plugin:

npm i [email protected]

Add the MetaMap button to your HTML file:

HTML Example for Cordova

 <input
     class="metaMapButton"
     id="metaMapButton"
     type="button"
     value="show MetaMap Flow"
     />

JavaScript

Add the MetaMap button in your JavaScript file index.js:

JavaScript Example for Cordova

function onDeviceReady() {

//trigger login on button click
var metaMapButton = document.getElementById("metaMapButton");

  metaMapButton.onclick = () => {
      //set 3 params clientId (cant be null), flowId, metadata
      var yourMetadata = { param1: "value1", param2: "value2" }
      var metaMapButtinParams = { clientId: "YOUR_CLIENT_ID", flowId: "YOUR_FLOW_ID", metadata: yourMetadata }
      cordova.plugins.MetaMapGlobalIDSDK.showMetaMapFlow(metaMapButtinParams)
    };

    //register to callback
    cordova.plugins.MetaMapGlobalIDSDK.setMetaMapCallback(
     params => {
       console.log("setMetaMapCallback success: " + params.identityId);
       console.log("setMetaMapCallback success: " + params.verificationID);
     },
     error => {
       console.log("setMetaMapCallback error: " + error);
     }
    );

}

Install MetaMap for Ionic Cordova

add target minimum version on the config.xml file

<preference name="deployment-target" value="12.0" />

add the plugin:

ionic cordova plugin add metamap-cordova-plugin

Add the MetaMap button to your HTML file:

HTML Example for Ionic Cordova

 <input
     class="metaMapButton"
     id="metaMapButton"
     type="button"
     value="show MetaMap Flow"
     />

Add the MetaMap button in your JavaScript file index.js:

JavaScript Example for Ionic Cordova

function onDeviceReady() {

//trigger login on button click
var metaMapButton = document.getElementById("metaMapButton");

  metaMapButton.onclick = () => {
      //set 3 params clientId (cant be null), flowId, metadata
      var yourMetadata = { param1: "value1", param2: "value2" }
      var metaMapButtinParams = { clientId: "YOUR_CLIENT_ID", flowId: "YOUR_FLOW_ID", metadata: yourMetadata }
      cordova.plugins.MetaMapGlobalIDSDK.showMetaMapFlow(metaMapButtinParams)
    };

    //register to callback
    cordova.plugins.MetaMapGlobalIDSDK.setMetaMapCallback(
      params => {
       console.log("setMetaMapCallback success: " + params.identityId);
       console.log("setMetaMapCallback success: " + params.verificationID);
     },
     error => {
       console.log("setMetaMapCallback error: " + error);
     }
    );

}

Android

Download the latest version of MetaMap for Android here.

Check that your project's Gradle file (<YourProject>/platforms/android/mati-global-id-sdk-cordova-plugin/<demoCordovaMati-build>.gradle) uses the latest version of Mati for Cordova:

    dependencies {
      implementation 'com.getmati:mati-sdk:<LATEST_VERSION>'
    }

Enable AndroidX support in config.xml.

   <platform name="android">
   	<preference name="AndroidXEnabled" value="true" />
   </platform>

iOS

In the info.plist file, add the following permissions to capture video, access the photo gallery, and capture audio for voiceliveness:
Info.plist

    <key>NSCameraUsageDescription</key>
    <string>MetaMap needs access to your Camera</string>
    
    <key>NSPhotoLibraryUsageDescription</key>
    <string>MetaMap needs access to your media library</string>
    
    <key>NSMicrophoneUsageDescription</key>
    <string>MetaMap needs access to your Microphone</string>
    
    <key>NSLocationWhenInUseUsageDescription</key>
    <string>MetaMap will use your location information to provide best possible verification experience.</string>
	
    <key>NSLocationAlwaysAndWhenInUseUsageDescription</key>
	<string>MetaMap will use your location information to provide best possible verification experience.</string>
	
	<key>NSLocationAlwaysUsageDescription</key>
    <string>MetaMap will use your location information to provide best possible verification experience.</string>

Metadata Usage

Metadata is an additional optional parameters:

Set the Language:

yourMetadata: {"fixedLanguage": "es"}

Set the Button Color:

yourMetadata: {"buttonColor": "hexColor"}

Set the Title color of the button:

yourMetadata: {"buttonTextColor": "hexColor"}

Set identity Id as parameter for re-verification:

yourMetadata: {"identityId": "value"}

Some error codes you may get during integration

402 - MetaMap services are not paid: please contact your customer success manager

403 - MetaMap credentials issues: please check your client id and MetaMap id