React Native Mobile SDK


Arkose Labs' mobile SDKs let you wrap our solution with React Native function calls. This guarantees seamless integration of your mobile apps with Arkose's full interactive challenges on detection and enforcement and does so without the extended wait times for separate mobile solutions.

This page covers the Mobile SDK for React Native on Android and iOS. If you are developing native apps for Android and iOS, see the Mobile SDK for Android page and Mobile SDK for iOS page.

The Arkose Mobile SDK:

  • Wraps Arkose's Advanced Enforcement Challenge in native OS “web views”.
  • Has 1-to-1 feature availability between web and mobile solutions.
  • Integrates with your apps through native TypeScript functions.
  • Handles errors through events.
  • Complies with Arkose Internal Security guidelines.
  • Complies with Google Play Store guidelines for ease of integration.
  • Complies with Apple App Store guidelines for ease of integration.
  • Is fully compatible with new Enforcement Challenge-API (EC-API) releases.
  • Supports minimum version Android OS 6.0 and iOS 13.0.

Mobile SDK High Level Design

Mobile SDK Builds Availability

The Arkose Labs Mobile SDKs are available via the Mobile SDK's Support page. Please talk with your CSM (Customer Success Manager) about your intended usage and to request access.


The Arkose Labs Mobile SDK for React Native works with React Native version 0.60 and above and supports Android 6.0 and iOS 13.0 and above.

All existing detection and challenge features on our web solutions are also available on the Mobile SDKs. All new ones are automatically added; you don't need to update your application every time we release a new Web platform. All challenge updates can be done without updating the SDKs or releasing a new version of your application.


The Arkose Labs Mobile SDKs are Arkose Labs Security reviewed and comply with Apple App Store and Google Play Store guidelines.


Follow the steps below to set up Arkose Labs Mobile SDK for React Native application. This applies to both Arkose Detect and Arkose Protect.


  • A host React Native application. You must be able to build and run this application.
  • For the full end-to-end Arkose setup, you must also complete the standard Arkose Server-Side setup instructions.

Step 1: Set up iOS Project

  1. Create an ArkoseLabs folder under the root of your React Native application folder
  2. Download the Arkose Labs React Native SDK and place it under the ArkoseLabs folder created in step 1 above.
  3. From the root of your application folder, run npm install ArkoseLabs/react-native-arkoselabs-x.y.z.tgz. Please update the x.y.z part in the file name with the actual version number that matches the downloaded file. This will install the node module react-native-arkoselabs in your application.
  4. Update s.source value in node_modules/react-native-arkoselabs/react-native-arkoselabs.podspec to s.source = { :http => 'file://'+__dir*__+'/../../../ArkoseLabs/react-native-arkoselabs-x.y.z.tgz'}
    • Please update the x.y.z part in the file name with the actual version number that matches the downloaded file.
  5. Add the following lines to ios/Podfile file under the main application target: pod 'react-native-arkoselabs' , :podspec => '../node_modules/react-native-arkoselabs'
  6. From the ios folder, run pod install to add 'react-native-arkoselabs' to the Pods.xcodeproj inside ios/Pods folder along with all associated Pods.
  7. Open the xcworkspace from the ios folder using Xcode.
  8. Add the xcframework to Pods project:
    1. Select the Pods Project in the navigator.
    2. In the Targets section, scroll down to react-native-arkoselabs and select the target.
    3. Select the Build Phases of react-native-arkoselabs target.
    4. Expand the Link Binary with Libraries section and press the + button.
    5. Select Add Others > Add Files, navigate to the ArkoseLabsKit.xcframework located under node_modules/react-native-arkoselabs/ios/Libs and select it.
  9. Add the same xcframework from the path specified above to the application project using the same steps as the Pods project above.
  10. Select the General tab of the application target, scroll down to Frameworks, Libraries, and Embedded Content.
  11. Press the + button here and add the ArkoseLabsKit.xcframework listed under the application Project.
  12. After the xcframework is added to this section, enable Embed & Sign option using the dropdown menu in this section.
  13. Build the Application from Xcode and close after it builds successfully.

Step 2: Import and add Arkose code to your application

  1. Navigate to App.tsx inside the Application folder to initialize the SDK.

    import { ArkoseEvents, ArkoseManager } from "react-native-arkoselabs";
    export default function App() {
      React.useEffect(() => {
        // Set the log level of the SDK
        // Register listeners for Arkose events
        ArkoseEvents.addListener("onReady", () => console.log("onReady event"));
        ArkoseEvents.addListener("onShow", () => console.log("onShow event"));
        ArkoseEvents.addListener("onShown", () => console.log("onShown event"));
        ArkoseEvents.addListener("onHide", () => console.log("onHide event"));
        ArkoseEvents.addListener("onSupress", () => console.log("onSupress event"));
        ArkoseEvents.addListener("onCompleted", (result) => {
          console.log("onCompleted event", result);
        ArkoseEvents.addListener("onError", (result) => {
          console.log("onError event", result);
        ArkoseEvents.addListener("onFailed", (result) => {
          console.log("onFailed event", result);
        // Initialize the SDK
          apiKey: "SPECIFY_YOUR_API_KEY",
          language: ""
      }, []);
  2. To show the Enforcement View from the onPress() event of a Login Button, call showEnforcementChallenge method with a dictionary of titles for the cancel and reset buttons. This will run Arkose Detect (when running Arkose Protect, it also runs Arkose’s Enforcement Challenge). During the enforcement lifecycle, ArkoseEvents will be emitted and the listeners are invoked.

    const enforcementParameters = {
      cancelButtonTitle: "Cancel",
      resetButtonTitle: "Reset",

Step 3: Run and test the app

  1. Run your React Native application.

  2. If running Arkose Protect, the view shows an Arkose Labs Enforcement Challenge.

    • If running Arkose Detect, the view runs Arkose Labs Detect.
  3. If running Arkose Protect, verify the challenge.

  4. When the verification or detection is successful, the onCompleted event returns a response token. The following sample code shows what this should look like and what to do with the token.

    ArkoseEvents.addListener("onCompleted", (result) => {
      // invoked On Enforcement Challenge success
      String userResponseToken = result.getResponse().toString();
      // Get value of the token
      String userResponseToken = arkoseChallengeResponse.getResponse().getString("token");
      Log.i(TAG,"Arkose EC complete: " + userResponseToken);
      // sendToBackendServer(userResponseToken);

ArkoseManager Class

ArkoseManager class provides public methods to integrate the application with the Arkose Labs platform.

  • initialize(configuration)
    Initialize Arkose Labs platform SDK with the configuration parameters. Configuration is a JSON dictionary or object with the following parameters:

    • apiKey: The public key of your account
    • apiBaseUrl: Base URL of Arkose Labs EC platform as supplied by Arkose Labs.
    • blob: Specify any encrypted data blobs to share with the Arkose Labs Platform. It is optional.
    • language: Specify any language setting for the Enforcement Challenge, the default value is en. It is optional.
  • showEnforcementChallenge(configuration)
    Display the Enforcement Challenge View and invokes the ArkoseChallengeDelegate methods to notify the result. Configuration is a JSON dictionary or object with the following parameters:

    • cancelButtonTitle: A localized string for the title of the Cancel button, the default value is "Cancel".If this parameter is set to nil, the Cancel button is not shown in the view.
    • resetButtonTitle: A localized string for the title of the Reset button, the default value is nil.If this parameter is set to nil, the Reset button is not shown in the view.
  • setLogLevel(logLevel)
    Set the log level for the SDK. All messages logged by the SDK will have the [ArkoseLabsKit] text for easy identification. Valid LogLevel values are: info, warn, error

ArkoseEvents Class

ArkoseEvents class provides public methods to register listeners for various events emitted by the SDK to notify the application of different activities.

Event NameDescriptionApplicable Product
onReadyListener function invoked when the Enforcement or Detection is ready.

The Enforcement or Detection cannot be triggered before this event. You may want to disable the UI you are protecting until this event has been triggered.
Arkose Detect
Arkose Protect
onShowListener function invoked when the Enforcement or Detection is completed.

The function is also invoked when an Enforcement Challenge or detection is re-displayed (e.g. if the user closes the EC or detection view and tries to continue). Note that the close button only appears when in Lightbox mode.
Arkose Detect
Arkose Protect
onShownListener function invoked when the Enforcement Challenge or Detection is displayed. The function is only invoked the first time an Enforcement Challenge is displayed.Arkose Protect
onCompletedListener function invoked when either:

a. For Arkose Protect, a session is classified as not needing a challenge or a challenge has been successfully completed.

b. For Arkose Detect, a session detection has been successfully completed.

c. A Response Object is passed to this function.
Arkose Detect
Arkose Protect
onHideListener function invoked when the EC or detection view is hidden. For example, this happens after an EC or detection is completed or if the user clicks the close button. Note that the close button only appears when in Lightbox mode.Arkose Detect
Arkose Protect
onSuppressListener function invoked when:

a. The Enforcement Challenge is suppressed (i.e. A session was classified as not requiring a challenge).

b. The Detection is running and Arkose Detect is analyzing the user intent.
Arkose Detect
Arkose Protect
onResetListener function invoked after the Enforcement resets. Typically occurs after a challenge has been successfully answered.Arkose Protect
onErrorListener function invoked when an error occurs when loading the challenge or detection.

A Response Object is passed to this function.
Arkose Detect
Arkose Protect
onFailedListener function invoked when a challenge has failed (the user has failed the challenge multiple times and is not allowed to continue the session).

A Response Object is passed to this function.
Arkose Protect