SDK Initialization¶

This article covers the initialization and runtime capabilities of the React Native SDK.

Import SDK¶

Now in your code, you can use:

import {
  FTMobileReactNative,
  FTReactNativeLog,
  FTReactNativeTrace,
  FTReactNativeRUM,
  FTMobileConfig,
  FTLogConfig,
  FTTraceConfig,
  FTRUMConfig,
  ErrorMonitorType,
  DeviceMetricsMonitorType,
  DetectFrequency,
  TraceType,
  FTLogStatus,
  EnvType,
} from '@cloudcare/react-native-mobile';

Basic Configuration¶

// Local environment deployment, Datakit deployment
let config: FTMobileConfig = {
  datakitUrl: datakitUrl,
};

// Using public DataWay
let config: FTMobileConfig = {
  datawayUrl: datawayUrl,
  clientToken: clientToken,
};

await FTMobileReactNative.sdkConfig(config);

Blacklist Filtering¶

Data Filter is used to filter RUM and Log data according to rules before the SDK writes to local cache. Data matching the filtering rules will not enter local cache and will not be reported.

• Local Rules: Configured via FTMobileConfig.dataFilters, issued by the App during SDK initialization.

• Remote Rules: After enabling FTMobileConfig.enableDataFilter, the SDK will fetch blacklist rules added on the Studio side.

• Local rules and remote rules take effect simultaneously. Data will be discarded if it matches any rule.

• Blacklist filtering executes after lineDataModifier and before local cache write. If both lineDataModifier and blacklist filtering are configured, filtering rules will be judged based on the modified data.

Data Filter operates on the SDK data write pipeline. Having too many rules or overly complex regular expressions may affect data write performance. It is recommended to configure only necessary rules.

let config: FTMobileConfig = {
  datawayUrl: datawayUrl,
  clientToken: clientToken,
  enableDataFilter: true,
  dataFilters: {
    logging: [
      "{ `source` in [ 'df_rum_ios_log' , 'df_rum_android_log' ] and `message` match [ 'timeout' ] }",
    ],
    rum: [
      "{ `resource_status` match [ '5..' ] }",
    ],
  },
};

await FTMobileReactNative.sdkConfig(config);

Rule Syntax¶

The Data Filter rule syntax is largely consistent with the blacklist filtering rules. For complete syntax description, please refer to Blacklist Filtering Rules.

The key of dataFilters represents the data category. Currently the SDK supports:

Each rule is expressed using { condition }. Matching any rule filters data under that category. Rules can use tag and field fields of the data.

Field value formats and operator semantics can refer to the Field Value Format Description and Operator Description in the blacklist filtering rules.

In SDK rule strings, all field values must use array format, and reverse operators are fixed as notin, notmatch.

{ `status` in [ 'debug' ] and `env` notin [ 'prod' ] and `message` notmatch [ '.*error.*' ] }

User Information Binding and Unbinding¶

Usage¶

/**
 * Bind user.
 * @param userId User ID.
 * @param userName User name.
 * @param userEmail User email.
 * @param extra User's extra information.
 */
bindRUMUserData(userId: string, userName?: string, userEmail?: string, extra?: object): Promise<void>;

/**
 * Unbind user.
 */
unbindRUMUserData(): Promise<void>;

Example¶

import { FTMobileReactNative } from '@cloudcare/react-native-mobile';
FTMobileReactNative.bindRUMUserData('react-native-user', 'user_name');

FTMobileReactNative.unbindRUMUserData();

Runtime Capabilities¶

Shut Down SDK¶

Use FTMobileReactNative to shut down the SDK.

/**
 * Shut down running objects within the SDK.
 */
shutDown(): Promise<void>;

FTMobileReactNative.shutDown();

Clear SDK Cache Data¶

Use FTMobileReactNative to clear unreported cache data.

/**
 * Clear all data that has not yet been uploaded to the server.
 */
clearAllData(): Promise<void>;

FTMobileReactNative.clearAllData();

Manually Sync Data¶

When FTMobileConfig.autoSync is configured as true, no additional action is needed, the SDK will sync automatically.

When FTMobileConfig.autoSync is configured as false, data synchronization needs to be triggered manually.

/**
 * Manually sync data. Needs to be triggered manually when `FTMobileConfig.autoSync = false`.
 */
flushSyncData(): Promise<void>;

FTMobileReactNative.flushSyncData();

Initialization Order Explanation¶

Please complete SDK initialization before registering the App in the top-level index.js file to ensure the SDK is fully ready before calling other SDK methods.

After completing the basic configuration, proceed with RUM, Log, Trace configurations.

import App from './App';

async function sdkInit() {
  await FTMobileReactNative.sdkConfig(config);
  await FTReactNativeRUM.setConfig(rumConfig);
  // ...
}

sdkInit();
AppRegistry.registerComponent('main', () => App);

Dynamic Configuration¶

Dynamic configuration related capabilities have been separated into Dynamic Configuration.