Fraud React Native

Overview

Forter's React Native plugin is built for:

Installation

Add the Forter dependency to your package.json file

{
 "dependencies": {
       "forter-react-plugin": "<forter-plugin-bitbucket-link>#v0.1.17"
  },
}

iOS

Add the ForterSDK pod and the React Native pod to your Podfile and run pod install.

pod 'ForterSDK', :git => '<forter-ios-sdk-bitbucket-link>forter-ios-sdk.git'
pod 'react-native-forter', :path => '../node_modules/forter-react'

If you are running ReactNative < 0.60 (this should work for 0.60 and above), you must also have the React dependencies defined in the Podfile as described here.

Run pod install (inside ios directory).

Android

Modify your android/settings.gradle

include ':react-native-forter'
project(':react-native-forter').projectDir = new File(rootProject.projectDir, '../node_modules/react-native-forter/android')

Add the below android/app/build.gradle to add Forter's private Maven repository:

repositories {
  maven {
    url "https:<forter-android-sdk-link>/android"
    credentials {
      username "username" // provided in Forter's portal documentation
      password "password" // provided in Forter's portal documentation
    }
  }
}

Note The following steps are not needed on ReactNative 0.60 and above

Link the project: execute from the shell react-native link react-native-forter in the project root or add manually:
Add the project to your dependencies

  dependencies {
    ...
    compile project(':react-native-forter')
  }

Finally, add the following code to your app to register Forter's module

import com.forter.mobile.reactnative.RNForterPackage;

    @Override
    protected List<ReactPackage> getPackages() {
      return Arrays.<ReactPackage>asList(
            new MainReactPackage(),
            //...
            new RNForterPackage(MainApplication.this)
            //...
      );
    }

JavaScript Setup

Add the following JavaScript code to your application's index.js along with the custom events tracking.

import {forterSDK, ForterActionType, ForterNavigationType} from 'react-native-forter';

AppRegistry.registerComponent(appName, () => App);

var myForterID = "1e34987a83" // Modify this with your Forter Site ID

forterSDK.setDevLogsEnabled();
forterSDK.getDeviceUniqueID( (deviceID) => {
    console.warn("deviceID = " + deviceID + " merchant=" + myForterID);
    forterSDK.init(myForterID, deviceID, (successResult) => {
        console.warn("OK: " + successResult);
    }, (errorResult) => {
        console.warn("FAIL: " + errorResult);
    });
});
 
// Examples for custom tracking
forterSDK.trackNavigation('mainpage', ForterNavigationType.PRODUCT);
forterSDK.trackAction(ForterActionType.ADD_TO_CART)

Test

Once you've integrated the mobile SDK in sandbox (using your sandbox SiteId), you can look up events being passed to Forter for a specific mobileUID using our Sandbox Mobile Events Viewer. This gives developers visibility into how Forter is receiving and storing mobile events.

Include mobileUID in backend and Forter API requests

Send the mobileUID generated by the Forter SDKs to your backend when an order is placed via your native mobile application.

This will allow Forter to connect behavioral and cyber data collected on the mobile applications to the order data sent from your backend. Merchants are in charge of how the mobileUID is passed and most will pass it securely via API request headers. In the case of native mobile app orders, make sure that the following fields are populated:

orderType: "MOBILE", "iOS", or "ANDROID" depending on your OS (mobile can be used for either OS)
forterMobileUID: This should be populated instead of the forterTokenCookie if your app is fully native including your checkout page. If you use a webview for the checkout page, please review our Webview Integration.
mobileAppVersion: should reflect the version of the app the user is on

Example React Mobile App Request

{
  "orderId": "Example_react_or06349",
  "orderType": "MOBILE",
  "timeSentToForter": 1415287568000,
  "checkoutTime": 1415273168,
  "connectionInformation": {
    "customerIP": "107.57.208.5",
    "userAgent": "testStore 18.4.1 rv:184100001 (iPhone; iOS 12.4.1; en_US; iPhone10,3)",
    "forterMobileUID": "6A9798AG16FF41F7B6B9878DD488ADD5", 
    "mobileAppVersion": "18.4.1"
  },
  "totalAmount": {
    "amountUSD": "99.95"
  }
  ...
}