Web

The Kloudfuse RUM SDK is available as a package on npm. To get started instrumenting your frontend application include the Kloudfuse RUM SDK dependency in your application:

npm install --save kf-browser-sdk

The SDK needs to be initialized before it begins gathering frontend telemetry. This initialization should occur as early as possible in your applications loading phase. Customize and include the below code snippet:

import kfuseRumSDK from 'kf-browser-sdk';

kfuseRumSDK.init({
  config: {
    applicationId: '<APPLICATION_ID>',
    clientToken: '<CLIENT_TOKEN>',
    proxy: '<KFUSE_RUM_ENDPOINT>',
    service: '<APPLICATION_NAME>',
    env: 'production',
    version: '1.0.0',
    sessionSampleRate: 100,
    defaultPrivacyLevel: 'mask', 'mask-user-input' | 'allow'
    enableSessionRecording: true,
    enableLogCollection: true,
  },
});

The permitted configuration options are documented below:

Associating User Information

As soon as your application has access to user information you may provide that information to the SDK to enrich all generated telemetry. To do this add the following code snippet:

kfuseRumSDK.setUser({
  id: "joebarra",
  email: "joe.barra@kloudfuse.com",
})

Flutter

The Kloudfuse Flutter SDK is available as a Flutter plugin

Installation

  1. Add the following to your pubspec.yaml file:

    dependencies:
  kf_sdk:

  2. Fetch the SDK with $ flutter pub get

  3. Initialize the SDK

    import 'package:kf_sdk/kf_sdk.dart';

void main() async {
  final configuration = KfConfiguration(
    applicationId: '<APPLICATION_ID>',
    clientToken: '<CLIENT_TOKEN>',
    customEndpoint: '<KFUSE_RUM_ENDPOINT>',
    env: '<ENV>',
    sessionSamplingRate: 100,
    service: '<APPLICATION_NAME>',
    env: 'production',
    version: '1.0.0',
  );

  await KfSdk.runApp(configuration, KfTrackingContent.granted, () async {
    runApp(MyApp());
  });
}

React Native

The Kloudfuse React Native SDK is available as an NPM package

Install

  1. Use your favorite package manager to install the Kloudfuse React Native SDK

    $ npm install kf-react-native-sdk

  2. Install the added pod

    $ cd ios && pod install

  3. Initialize the sdk in your App

    import { KfProvider } from 'kf-react-native-sdk';

//Wrap the content of your App component in a KfProvider component, passing it your configuration:

const config = {
    applicationId: <APPLICATION_ID>,
    clientToken: <CLIENT_TOKEN>,
    env: <ENV>,
    proxy: <KFUSE_RUM_ENDPOINT>,
    sessionSamplingRate: 100,
    serviceName: <SERVICE_NAME>,
    version: 1.0.0,
};

export default function App() {
    return (
        <KfProvider config={config}>
            <Navigation />
        </KfProvider>
    );
}