The Mobile Protect SDK has a dedicated integration for iOS and Android apps built using React Native. This document will take you through the steps to integrate the SDK into your build system. For other guides, check out Mobile Protect Installation Guides

To fetch the Mobile Protect SDK via React Native, an API key is needed. If you haven’t received an API key for Mobile Protect, please contact us.

Preface

This will involve some steps on the React Native side as well as some steps on both iOS and Android.

React Native Integration

Add mobile-protect as a dependency in your package.json file.

$ npm install mobile-protect

The project’s package.json should then contain the following entry:

  "dependencies": {
    "mobile-protect": "23.0.7",
  }

For Mobile Protect Anti Fraud, use the mobile-protect-antifraud package:

  "dependencies": {
    "mobile-protect-antifraud": "23.0.7",
  }

See https://docs.npmjs.com/about-semantic-versioning for deciding if pinning the versions is the best practice for your project.

Android Integration

1. Follow the steps on Mobile Protect SDK for Android via Maven

2. In the Android project copy the mobileprotect.xml config file into the React Native project's Android xml resources folder. If the xml directory does not exist, create it.

For Anti Fraud on Android, you will also need to add the config from this step:

https://datatheorem.atlassian.net/wiki/spaces/PKB/pages/1800208391/Mobile+Protect+SDK+for+Android+via+Maven#Optional%3A-Enable-Anti-fraud

iOS Integration

1. Follow step 1 on Mobile Protect SDK for iOS via CocoaPods (cocoapods.org)

2. In the iOS project copy the MobileProtect.plist config file into the React Native project's Xcode project. See Add Existing Files and Folders to a Project for instructions.

Results

Please visit https://www.securetheorem.com/mobile/protect to see the list of your apps and the state of protection, along with the individual protection item details.