Ask AI

React Native SDK Integration

Introduction

This document serves as a comprehensive guide for React Native developers to seamlessly integrate Nashid Verify SDK into their applications. By following the step-by-step instructions provided, developers can simplify the process of scanning Oman ID cards and passports, and efficiently retrieve document scan results.

Nashid Verify SDK is designed to streamline identity verification processes, ensuring a smooth integration experience across platforms.

Prerequisites

React Native:

  • React Native Environment.
  • Node.js
  • Npm or yarn.
  • Android Studio
  • Latest Android Studio with SDK tools.
  • Xcode (16.1 or higher) for iOS development.

Installation

React Native:

  1. Install the package, running the following command:
    1.  npm i nashidverifysdk
  1. For iOS, Do the following:
    1. In your Podfile, add the following line to include Nashid Verify SDK:
      1. target "YourApp" do
          config = use_native_modules!
          use_frameworks!
          pod 'nashidVerifySDK', 'x.y.z' replace x.x.x with the latest version of the SDK you are using
          use_react_native!(
            :path => config[:reactNativePath],
            :hermes_enabled => false,
            :app_path => "#{Pod::Config.instance.installation_root}/.."
          )
          post_install do |installer|
            react_native_post_install(
              installer,
              config[:reactNativePath],
              :mac_catalyst_enabled => false
            )
            installer.generated_projects.each do |project|
              project.targets.each do |target|
                target.build_configurations.each do |config|
                  config.build_settings['IPHONEOS_DEPLOYMENT_TARGET'] = '13.0'
                end
              end
            end
            installer.pods_project.targets.each do |target|
              target.build_configurations.each do |config|
                config.build_settings['DEBUG_INFORMATION_FORMAT'] = 'dwarf-with-dsym'
                config.build_settings['OTHER_SWIFT_FLAGS'] = '-no-verify-emitted-module-interface'
                config.build_settings['BUILD_LIBRARY_FOR_DISTRIBUTION'] = 'YES'
                config.build_settings['ONLY_ACTIVE_ARCH'] = 'NO'
              end
            end
          end
        end
    2. Add the required permissions in your Info.plist file:
      1. <key>NSCameraUsageDescription</key>
        <string>Camera permission is required to complete the full KYC process.</string>
        <key>NFCReaderUsageDescription</key>
        <string>NFC permission is required to complete the full KYC process.</string>
         <key>NSLocationWhenInUseUsageDescription</key>
         <string>Location permission is required to complete the full KYC process.</string>
         <key>NSLocationAlwaysUsageDescription</key>
         <string>Location permission is required to complete the full KYC process.</string>
         <key>NSLocationAlwaysAndWhenInUseUsageDescription</key>
         <string>Location permission is required to complete the full KYC process.</string>
        <key>com.apple.developer.nfc.readersession.iso7816.select-identifiers</key>
        <array>
          <string>A000000018524F500101</string>
          <string>A0000002471001</string>
          <string>A0000002472001</string>
          <string>00000000000000</string>
          <string>A00000024300130000000101</string>
          <string>A0000002430013000000010109</string>
          <string>A000000243001300000001FF</string>
        </array>
    3. Run:
      1. cd ios && pod install
  1. For Android, Do the following:
    1. In your app-level build.gradle file, add the following dependency for the Nashid Verify SDK
      1. implementation 'io.nashid.verify:sdk:x.x.x'

        Note: Replace x.x.x with the latest version of the SDK.

    2. Update AndroidManifest.xml:
      1. <manifest xmlns:android="http://schemas.android.com/apk/res/android"
            xmlns:tools="http://schemas.android.com/tools"> <!--Add this line in manifest tag-->
        <!-- Add this attribute to the <application> tag -->
        tools:replace="android:name"
        android:enableOnBackInvokedCallback="true"
    3. Extend the OnCreate() lifecycle function in your MainActivity.kt to include the following:
      1. import nashid.verify.sdk.utils.KoinEnvironment;
        import android.util.Log;
        @Override
        public void onCreate() {
            super.onCreate();
            SoLoader.init(this, OpenSourceMergedSoMapping);
            // Initialize Koin
            try {
                KoinEnvironment.initKoin(this); // Initialize Koin in the application context
                Log.d("KoinInitialization", "Koin initialized successfully.");
            } catch (Exception e) {
                Log.e("KoinInitialization", "Failed to initialize Koin: " + e.getMessage(), e);
            }
        }
    4. Add the following lines to app-level build.gradle file:
      1. android {
          compileSdk 34
          defaultConfig {
             minSdk 21
             targetSdk 34
          }
        }

Usage

1. Import Nashid Verify SDK:

React Native:

 import {
     initialize,
     verify,
     getVerificationResult,
   } from 'nashidverifysdk';

2. Initialize Nashid Verify SDK:

To start using the SDK, you need to create an SDK Application and configure the desired verification flow via your admin dashboard.

The initialize() function expects the following arguments:

  1. SDK Application Key (Mandatory): The key generated using your Nashid Verify admin dashboard.
  1. SDK Application Key Secret (Mandatory): The key secret generated using your Nashid Verify admin dashboard.
  1. Language Code (Optional): en for English (default), ar for Arabic ..etc.
  1. Extra Data (Optional): An object of key-value pairs that you can use to annotate the verification data generated with additional data that your consumer application may need.

The initialize() function returns a value, indicating whether initialization was successful (true) or unsuccessful (false), along with an error message in case of unsuccessful initialization.

React Native:

const response = await initialize(
  'Your SDK key',
  'Your SDK secret',
  'en' // Language (default: "en")
);

3. Verify A Document Using Nashid Verify SDK

Once Nashid Verify SDK is initialized successfully, you can start verifications journeys for your users using the verify() function.

This function expects an input argument specifying the type of document to be verified (for now Omani ID or International Passport).

And as a result of the verification flow it returns three values:

  1. Result: A boolean flag that is true when the verification flow is successful, and false other wise.
  1. Error Message: A string contains the error details in case of unsuccessful verification.
  1. Verification ID: An ID of the created verification. This ID can be used later on to get the results collected with any additional checks/information annotated by backend services.

Example1: Verify With Omani ID

React Native:

const result = await verify(1); // 1 for Omani ID

Example1: Verify With International Passport

React Native:

const result = await verify(2); // 2 for Passport

4. Using Nashid Verify SDK To Get A Verification Result

Once you have a valid verification ID as an outcome of a successful verification journey you can use getVerificationResult() function to get the results collected with any additional checks/information annotated by backend services using the verification ID.

Example: Retrieve the data of verification ID abcd1234

React Native:

const result = await getVerificationResult(
  'abcd1234'
);
  • The verificationID (abcd1234) is just an example value that represents what we get as a result of the verify functionality.
  • Example Response:
    • {
          "data": {
              "id": "abcd1234",
              "created_at": "2025-01-14T09:44:39.051016+00:00",
              "updated_at": "2025-01-14T09:45:33.344098+00:00",
              "updated_by": null,
              "data": {
                  "NFC": {
                      "name": "John Doe",
                      "title": "Mr.",
                      "gender": "Male",
                      "address": "123 Elm Street",
                      "telephone": "123-456-7890",
                      "issue_date": "2024-01-01",
                      "profession": "Software Engineer",
                      "tb_numbers": "TB12345",
                      "custody_info": "No",
                      "expiry_date": "2030-01-01",
                      "permit_type": "Work",
                      "use_by_date": "2030-12-31",
                      "visa_number": "V123456",
                      "date_of_birth": "1990-05-15",
                      "document_type": "Passport",
                      "id_card_number": "ID123456",
                      "place_of_birth": "City A",
                      "rsa_public_key": "XYZ123",
                      "issuing_country": "USA",
                      "passport_number": "P12345678",
                      "personal_number": "987654321",
                      "gender_arabic": "ذكر",
                      "permit_number": "Permit123",
                      "gender_english": "Male",
                      "identity_number": "ID123",
                      "full_name_arabic": "جون دو",
                      "full_name_english": "John Doe",
                      "nationality_arabic": "أمريكي",
                      "company_name_arabic": "شركة البرمجيات",
                      "nationality_english": "American",
                      "company_name_english": "Software Company",
                      "place_of_issue_arabic": "مدينة ب",
                      "company_address_arabic": "123 شارع النخيل",
                      "place_of_issue_english": "City B",
                      "country_of_birth_arabic": "الولايات المتحدة",
                      "country_of_birth_english": "United States",
                      "ecdsa_public_key": "ABC456",
                      "personal_summary": "Experienced software engineer.",
                      "issuing_authority": "Government Authority",
                      "passport_expiry_date": "2030-01-01",
                      "proof_of_citizenship": "Yes",
                      "security_information": "Secure",
                      "active_authentication_passed": "Yes",
                      "issuer_digital_signature_verification": "Passed"
                  },
                  "scan": {
                      "gender": "Male",
                      "country": "USA",
                      "mrz_text": "MRZ123456",
                      "full_name": "John Doe",
                      "document_no": "DOC12345",
                      "nationality": "American",
                      "date_of_birth": "1990-05-15",
                      "document_type": "Passport",
                      "expiry_date": "2030-01-01"
                  },
                  "liveness": {
                      "passive_liveness_confirmed": false,
                      "active_liveness_confirmed": true
                  }
              },
              "metadata": {
                  "location": {
                      "latitude": 37.7749,
                      "longitude": -122.4194
                  },
                  "extradata": null,
                  "timestamp": "2024-58-22 08:58:52",
                  "device_ipv4": "0.0.0.0",
                  "device_ipv6": "fe80::4cc0:34ff:fe60:cc21",
                  "device_type": "SM-G996B",
                  "system_name": "Android",
                  "system_version": "13",
                  "device_identifier": "samsung_SM-G996B"
              },
              "artifacts": {
                  "liveness_image": "https://xxxxx.yyyyy/xxx.png",
                  "ocr_face_image": "https://xxxxx.yyyyy/yyy.png",
                  "back_side_image": "https://xxxxx.yyyyy/zzz.png",
                  "front_side_image": "https://xxxxx.yyyyy/aaaa.png",
                  "livness_image_without_bg": "https://xxxxx.yyyyy/abcd.png"
              },
              "annotations": {
                  "face_matching": {
                      "mode": "ocr",
                      "notes": "",
                      "is_successful": false,
                      "matching_score": 40,
                      "threshold_used": 53,
                      "nfc_matching_score": null,
                      "ocr_matching_score": 40
                  }
              },
              "type": {
                  "value": 1,
                  "title": "Omani ID"
              },
              "status": {
                  "value": 2,
                  "title": "Unsuccessful"
              }
          },
          "message": "Verification retrieved successfully.",
          "consolidated_message": "Verification retrieved successfully.",
          "details": {}
      }
Did this answer your question?
😞
😐
🤩

Last updated on February 1, 2025