react-native-ts-idv v1.0.3
React Native - Identity Verification
React Native module for Transmit Security Identity Verification SDK. Verify customers’ identities during onboarding and beyond.
About Identity Verification
Transmit Security Identity Verification SDK offers a comprehensive identity verification solution, utilizing deep document inspection, biometric matching, and rapid background checks to streamline customer enrollment, enhance compliance, expedite time to market, prevent fraud, and fortify security within a seamless CIAM platform.
Using this module, you can easily integrate our Identity Verification SDK into your React Native app for seamless and secure user identity verification. Learn more about how you can boost your security with Transmit Security Identity Verification.
Understand the flow
We recommended that you read more about the verification flow required steps in our documentation
Configure your app
To integrate this module, you'll need to configure an application.
- From the Applications page, create a new application or use an existing one.
- From the application settings:
- For Client type , select native
- For Redirect URI , enter your website URL. This is a mandatory field, but it isn't used for this flow.
- Obtain your client ID and secret for API calls, which are autogenerated upon app creation.
Example project setup
- In your project, navigate to
example/src/config.ts
and configure the clientId and secret using the credentials obtained from the Transmit portal. - Ensure you have all the necessary dependencies by running
yarn
in both the module's root folder and the example root folder. - Run the example app on a real device using Xcode or Android Studio. Alternatively, execute
yarn example ios
oryarn example android
.
Important Security Note: Never store your
secret
in a front-end application.The example app utilizes a mock server to manage communication with the identity verification platform. This mock server employs the
secret
you have specified inexample/src/config.ts
exclusively for demonstration purposes. It is paramount that you safeguard yoursecret
in a secure and confidential location.
Module installation
To install this module, execute the following command in your project's root folder.
npm install react-native-ts-idv
iOS Setup
You might need to execute pod install
in your project's /ios
folder and set your minimum iOS target to 13.0 in your Podfile (e.g platform :ios, 13.0
).
Android Setup
Add to app/build.gradle
under repositories
repositories {
maven {
url('https://transmit.jfrog.io/artifactory/transmit-security-gradle-release-local/')
}
}
Note:
As for projects on Gradle 8+ and Kotlin 1.8+ build will fail if the JDK version between
compileKotlin and compileJava and jvmTarget are not aligned.
This won't be necessary anymore from React Native 0.73. More on this: https://kotlinlang.org/docs/whatsnew18.html#obligatory-check-for-jvm-targets-of-related-kotlin-and-java-compile-tasks
Add camera permission
For module usage, configuring permissions for the device camera on both iOS and Android is necessary. You must also explicitly request user permission before commencing the identity verification process. See the /example
project to learn more.
Usage
Module Setup
import IdentityVerification, { TSIDV } from 'react-native-ts-idv';
const { TsIdv } = NativeModules; // Import NativeModules and NativeEventEmitter from 'react-native'
const eventEmitter = new NativeEventEmitter(TsIdv); // Create an event emitter with the native module TsIdv
private verificationStatusChangeSub?: EmitterSubscription; // Imported from react-native
componentDidMount(): void {
// Setup the module as soon your component is ready
this.onAppReady().catch(e => void e);
}
private onAppReady = async (): Promise<void> => {
/* Initialize the module with parameters:
1. ClientID obtained from the application settings in the Transmit portal
2. Optional: Base URL. Defaults to TSIDV.BaseURL.us
*/
IdentityVerification.initialize(config.clientId, TSIDV.BaseURL.us);
// Register to receive status updates
this.verificationStatusChangeSub = eventEmitter.addListener(
"idv_status_change_event", // Important! use this event name
this.onVerificationStatusChange
);
}
componentWillUnmount(): void {
this.verificationStatusChangeSub?.remove(); // Remove the subscription when it's no longer needed
}
Start the verification process
onStartVerificationProcess = async (): Promise<void> => {
try {
// See Step 7: Create session https://developer.transmitsecurity.com/guides/verify/quick_start_ios/ to get startToken
const startToken = verificationSession.startToken;
await IdentityVerification.startIdentityVerification(startToken); // This will trigger the native SDK to start the flow
console.log("Started identity verification process");
} catch (error) {
console.error(`Error verifying user identity: ${error}`);
}
}
Handle status changes
const enum VerificationStatus {
verificationDidCancel = "verificationDidCancel",
verificationDidComplete = "verificationDidComplete",
verificationDidFail = "verificationDidFail",
verificationDidStartCapturing = "verificationDidStartCapturing",
verificationDidStartProcessing = "verificationDidStartProcessing",
verificationRequiresRecapture = "verificationRequiresRecapture",
}
private onVerificationStatusChange = (params: any) => {
const status = params["status"];
const additionalData = params["additionalData"];
switch (status) {
case VerificationStatus.verificationDidCancel:
console.log(`verificationDidCancel`);
break;
case VerificationStatus.verificationDidComplete:
console.log(`verificationDidComplete`);
break;
case VerificationStatus.verificationDidFail:
const error: string = additionalData["error"];
console.log(`verificationDidFail: ${error}`);
break;
case VerificationStatus.verificationDidStartCapturing:
console.log(`verificationDidStartCapturing`);
break;
case VerificationStatus.verificationDidStartProcessing:
console.log(`verificationDidStartProcessing`);
break;
case VerificationStatus.verificationRequiresRecapture:
const reason: string = additionalData["error"];
console.log(`verificationRequiresRecapture: ${reason}`);
break;
default:
console.log(`Unhandled verification status: ${status}`);
}
}
Obtaining verification results
Once the module emits the verificationDidComplete
event, you can fetch the results from your server as described in Step 10: Handle verification result
Important Notes
- Make sure to use
idv_status_change_event
for the emitter event name. - Please take note that the example application uses a client-side mock server. In a production environment, a real server is required. Additionally, it is crucial to emphasize that storing the client secret in your front-end application is strictly discouraged for security reasons.
Support
Author
Transmit Security, https://github.com/TransmitSecurity
License
This project is licensed under the MIT license. See the LICENSE file for more info.