Meteor Cordova Web

📘

Sample Project

You can find the sample project for meteor-cordova integration.

This is the document for the integration of IDWise Web SDK in cordova based frameworks like Meteor

1. Requirements:

You have cordova up and running for the platform you want to integrate.

2. Integration

You can follow up the integration steps of IDWise Web SDK to integrate in the framework that uses cordova i.e Meteor

2.1 Requesting Native Permissions

Web SDK requires permission to use camera which works well when we run the Web SDK in a browser. But will fail when we run it in a native platform like Android and iOS as Web SDK can't access the native api's for requesting permissions.

For this case we have to request the camera permissions natively before loading the Web SDK.

You can use any cordova plugin that seems fit for requesting permissions, but we recommend you to use cordova-diagnostic-plugin

In order to add this plugin in you meteor based app run this command meteor add cordova:cordova-plugin-diagnostic

function requestCameraPermissions() {
    if (Meteor.isCordova) {
      cordova.plugins.diagnostic.requestCameraAuthorization({
        successCallback: function (status) {
          console.log(`${status}`);
          console.log("Successfully requested camera authorization: " + status);
          setPermissionStatus(status);
          if (status === "GRANTED" || status === "authorized") {
            console.log("Permission granted loading IDWise");
            loadIDWise();
            return;
          } else {
            console.log("Permission not granted", status);
          }
        },
        errorCallback: handleError,
        externalStorage: true,
      });
    } else {
      console.log("Loading IDWise web");
      loadIDWise();
    }
  }

Use this snippet in-order to request permission for native platforms.

3. iOS camera issue fix

Cordova overrides the camera UI in iOS. In order to use the html elements for camera control you need to set the preference.

In meteor

App.setPreference('AllowInlineMediaPlayback', true);

The resulting config.xml for cordova should have this entry like this.

<preference name="AllowInlineMediaPlayback" value="true"/>

4. Ionic interactivity fix

Ionic cancels all the taps/clicks which are non-ionic. Since IDWise-sdk is an external entity all the clicks on sdk will be ignored. To enable them add the attribute data-tap-disabled=true for the idwise-mount container.

 <div id="idwise-mount" data-tap-disabled="true"></div>

5. Testing

It's important to test the created build on a physical device since the emulator doesn't replicate the functionality of the camera.