Skip to content

Custom Tags Usage¶

This document covers the global context and custom tag capabilities of the React Native SDK.

Adding Custom Tags at Runtime¶

Usage¶

/**
 * Add custom global parameters. Applies to RUM and Log data.
 */
appendGlobalContext(context: object): Promise<void>;

/**
 * Add custom RUM global parameters. Applies to RUM data.
 */
appendRUMGlobalContext(context: object): Promise<void>;

/**
 * Add custom Log global parameters. Applies to Log data.
 */
appendLogGlobalContext(context: object): Promise<void>;

Example¶

FTMobileReactNative.appendGlobalContext({ global_key: 'global_value' });

FTMobileReactNative.appendRUMGlobalContext({ rum_key: 'rum_value' });

FTMobileReactNative.appendLogGlobalContext({ log_key: 'log_value' });

Custom Tag Usage Examples¶

Compilation Configuration Method¶

Use react-native-config to configure multiple environments and set corresponding custom tag values in different environments.

let rumConfig: FTRUMConfig = {
  iOSAppId: iOSAppId,
  androidAppId: androidAppId,
  monitorType: MonitorType.all,
  enableTrackUserAction: true,
  enableTrackUserResource: true,
  enableTrackError: true,
  enableNativeUserAction: false,
  enableNativeUserResource: false,
  enableNativeUserView: false,
  globalContext: { track_id: Config.TRACK_ID },
};

await FTReactNativeRUM.setConfig(rumConfig);

Runtime Read/Write File Method¶

Use data persistence methods, such as AsyncStorage, to read stored custom tags when initializing the SDK.

let rumConfig: FTRUMConfig = {
  iOSAppId: iOSAppId,
  androidAppId: androidAppId,
  monitorType: MonitorType.all,
  enableTrackUserAction: true,
  enableTrackUserResource: true,
  enableTrackError: true,
  enableNativeUserAction: false,
  enableNativeUserResource: false,
  enableNativeUserView: false,
};

await new Promise(function (resolve) {
  AsyncStorage.getItem('track_id', (error, result) => {
    if (result === null) {
      console.log('Failed to get' + error);
    } else {
      console.log('Successfully got' + result);
      if (result != undefined) {
        rumConfig.globalContext = { track_id: result };
      }
    }
    resolve(FTReactNativeRUM.setConfig(rumConfig));
  });
});

Add or change custom tags to the file anywhere.

AsyncStorage.setItem('track_id', valueString, (error) => {
  if (error) {
    console.log('Failed to store' + error);
  } else {
    console.log('Successfully stored');
  }
});

Finally, restart the application to take effect.

Dynamic Addition During SDK Runtime¶

After the SDK initialization is complete, use FTMobileReactNative.appendGlobalContext(globalContext), FTMobileReactNative.appendRUMGlobalContext(globalContext), FTMobileReactNative.appendLogGlobalContext(globalContext) to dynamically add tags. The settings take effect immediately.

!!! warning

Avoid using the same key as the `globalContext` in the SDK initialization configuration or SDK built-in fields. In case of duplicate keys, the static tags in the initialization configuration take precedence over dynamically added tags.

FTMobileReactNative.sdkConfig(config);

function getInfoFromNet(info: Info) {
  const globalContext = { delay_key: info.value };
  FTMobileReactNative.appendGlobalContext(globalContext);
}

For addition rules, please refer to Android Conflict Field Description.