Skip to main content

Flutter Plugin

Getting Started​

Latest release: Version 1.3.0

Requirements​

  1. iOS 13.0 and higher Or API level 23 (Android 6.0) or higher
  2. Internet connection
  3. Camera

Resources​

Integration Sample (Dart): Shufti Pro Flutter-SDK

Installation​

Tip

It’s always recommended to use the updated version

Step 1: Run this command: dart pub add shuftipro_sdk with dart or flutter pub add shuftipro_sdk with flutter
Or
Add dependency in pubspec.yaml as 

dependencies: 
  shuftipro_sdk: ^1.3.0

Step 2: Go to project > android > build.gradle file and add the following

allprojects {
    repositories {
        google()
        mavenCentral()
        maven { url 'https://jitpack.io' } // add this line
    }
}

Step 3: For IOS, make sure to add the following post-install hook to your Podfile.

post_install do |installer|
   installer.pods_project.targets.each do |target|
     if ['lottie-ios', 'Socket.IO-Client-Swift', 'Starscream'].include? target.name
       target.build_configurations.each do |config|
           config.build_settings['BUILD_LIBRARY_FOR_DISTRIBUTION'] = 'YES'
           config.build_settings['IPHONEOS_DEPLOYMENT_TARGET'] = '12.0'
        end
      end
    end
  end

Step 4: Import 'package:shuftipro_sdk/ShuftiPro.dart' in your class to send the request to ShuftiPro's SDK.

Note

See the sample project provided to learn the most common use. Make sure to build on real devices.

Basic Usage​

Note

Make sure you have obtained authorization credentials before proceeding. You can get client id or secret key and generate access token like this.

Authorization​

The following code snippet shows how to use the access token in auth object.

Access Token​

Make auth object using access token

Map<String,Object> authObject = {
          "auth_type": "access_token",
          "access_token": accessToken,
        };

Configuration​

The Shufti Pro’s mobile SDKs can be configured on the basis of parameters provided in the config object. The details of parameters can be found here.

Map<String,Object> configObject = {
      "open_webview": false, // pass true for verification through hybrid view
      "asyncRequest": false, // This parameter is used to get a callback instantly without waiting for verification results.
      "captureEnabled": false, // This parameter is used to open the camera directly in webview.
      "dark_mode": false, // This parameter is used to change the SDK theme.
    };

Request Object​

This object contains the service objects and their settings through which the merchant wants to verify end users. Complete details of service objects and their parameters can be found here.

Map<String, Object> createdPayload = {
        "country": "US",
        "reference": "12345678",
        "language": "EN",
        "email": "",
        "verification_mode": "image_only",
        "show_results": 1,
        "face": {},
        "background_checks": {},
        "phone": {},
        "document": {
          "supported_types": [
            "passport",
            "id_card",
            "driving_license",
            "credit_or_debit_card",
          ],
          /* Keep name, dob, document_number, expiry_date, issue_date empty for with-OCR request*/
 
          "name": {
            "first_name": "John",
            "last_name": "Johsan",
            "middle_name": "Livone",
          },
          "dob": "",
          "document_number": "19901112",
          "expiry_date": "1996-11-12",
          "issue_date": "1990-11-12",
          "gender": "M",
          "backside_proof_required": "1",
        },
 
        //Creating Document Two Object is exactly the same as document object. 
 
        "address": {
          "full_address": "ST#2, 937-B, los angeles.",
          "name": {
            "first_name": "Johon",
            "last_name": "Johsan",
            "middle_name": "Livone",
          },
          "supported_types": ["id_card", "utility_bill", "bank_statement", "passport", "driving_license"],
        },
        /* Keep name and full_address empty for with-OCR request */
 
 
        "consent": {
          "supported_types": ["printed", "handwritten"],
          "text": "My name is John Doe and I authorise this transaction of \$100/-",
        },
      };

Initialisation​

Shufti Pro's mobile SDK can be initialized by using the following method and passing auth, config and request objects as the parameters.

ShuftiproSdk.sendRequest(authObject, createdPayload, configObject);

Verification Types​

Native Flow​

In the native verification flow, the end-user interacts with the native mobile SDK. The native flow of verification tends to be much faster since the whole process depends on the device's processing power. All the proofs are taken against required services and then a request is made to the server
You can enable native flow by passing false for open_webview key in Config object.

Map<String,Object> configObject = {
      "open_webview": false
    };

Hybrid Flow​

The hybrid verification flow includes mobile verifications on a web view built on HTML 5 that will show the verification process to the end user. End-user provides the information in the online customer onboarding process. In hybrid flow, proofs are uploaded after every service, verification results are shown simultaneously in case of decline, and the user can retry the request.
You can enable hybrid flow by passing true for open_webview key in Config object.

```js
Map<String,Object> configObject = {
      "open_webview": true
    };
info

In both flows, Shufti Pro provides the facility for their customers to tailor the identity verification services according to their needs.

Callbacks​

The SDK receives callback events as result, whether the verification journey is completed or left mid-way. The call back is received in following function

var response = await ShuftiproSdk.sendRequest(authObject, createdPayload, configObject);

The complete list of callback events can be found here.

Customisation​

ShuftiPro supports a set of customization options that will influence the appearance of the mobile SDK.

Verification flow and UI​

The complete verification journey is customisable. To skip the screen from verification flow, you need to provide corresponding parameter to the SDK through the request/config object. For instance;

Request Object

"country" : "GB" // providing a value to this parameter will not ask the end user to provide his country

"verification_mode" : "image_only" // "image_only" or "video_only" values will allow you to avoid mode selection at real-time

"allow_online" : "1" // 1 value will ask the user to capture real time proofs(image or video) depending upon verification mode

"allow_offline" : "1" // 1 value will ask the user to upload proofs(image or video) depending upon verification mode

"decline_on_single_step" : "1" // this parameter will work with onsite flow(open_webview : true). This will show continue the journey only if pervious step is successfully verified

"show_feedback_form" : "1" // this parameter will work with onsite flow(open_webview : true). 1 value will ask the user for its feedback at the end of verification

// Service Level Parameters

"supported_types" : [id_card] // providing a single value to this parameter will not ask the user for document type

"show_ocr_form" : "1" // this parameter will work with onsite flow(open_webview : true). 1 value will show the OCR form to the user

Config Object

"asyncRequest": "true" // passing true value to this parameter will not show result screen to the user and will just return the callback on request completion

Dark mode​

To apply dark theme/mode in SDK, initialize the SDK with following parameter in the config object.

...
        "dark_mode" : false,

Android​

To customize the UI of your Android module, you can add the related files in the "android>app>src>main>res>values" directory.

Colours​

The colors of buttons and fonts can be customized by overriding the values of following variables in the project's color.xml file, as given in the following code snippet.

<color name="light_button_color">#2B6AD8</color>
<color name="light_text_color">#1D2C42</color>
<color name="dark_button_color">#FF7A77</color>
<color name="dark_text_color">#ffffff</color>
<color name="button_text_color">#FFFFFFFF</color>

Personalization​

Shufti Pro provides its users with the facility to personalize the text of the SDK according to their individual requirements. The client can personalize the text of the SDK by changing the values of the corresponding variables given in this strings.xml file. The user must override the values of desired variables in their project's strings.xml file.

IOS​

To customize the UI of your iOS module, you can follow the following steps.

Colours​

To customize the colours of your iOS module, you can use hex values of your choice in the config object, as given in following code snippet

 Map<String,Object> configObj = {
    ...
    "font_color": "#263B54",
    "button_text_color": "#FFFFFF",
    "button_background_color": "#1F5AF6",
  }

Personalization​

Shufti Pro provides its users with the facility to personalize the text of the SDK according to their individual requirements. Add your own Localizable.strings file to your ios project using standard iOS localization mechanism. To change a specific text, copy the file from here and override the corresponding keys.

Changelog​

DateSDK VersionsChanges
Jun 08, 20231.3.0
  • Update SDK version of android (0.6.5) & iOS(3.5.7).
May 05, 20231.2.9
  • Update SDK version of android & iOS.
May 02, 20231.2.8
  • Response returning issue and Webveiw related issue resolved
Apr 19, 20231.2.7
  • Add stepper in sdk and improve user experience
Mar 22, 20231.2.6
  • JSON conversion issue fixed
Mar 20, 20231.2.5
  • Updated Proguard rules
Feb 24, 20231.2.4
  • Device configurations handled and response is improved
Feb 10, 20231.2.3
  • Implement tap to focus in flutter SDK
Jan 21, 20231.2.2
  • Image quality while capturing proofs, is increased
Jan 18, 20231.2.0
  • Documentation was updated to use latest plugin with flutter project
Jan 05, 20231.1.9
  • Auto-capture functionality added
  • Improved UI - the UI was re-designed to improve the user experience
  • The flow was re-designed to improve experience
Nov 22, 20221.1.8
  • Android and IOS syncing issues resolved.
    • The issue of "client_id" key was resolved
Nov 16, 20221.1.7
  • Multi-language response functionality added.
    • SDK will now be able to return the OCR results in languages other than english.