RUM Instructions

Real User Monitoring (RUM) captures performance metrics and user interactions from your web applications in production. Enabling it changes cluster-wide configuration in custom-values.yaml, so make these changes as part of a normal Helm upgrade.

Session replay storage is optional and configured separately — see RUM Session Replay Storage: AWS S3, RUM Session Replay Storage: Azure Blob, or RUM Session Replay Storage: Google GCS. The steps below are required regardless of whether you enable session replay.

Configure the custom-values.yaml File

  1. Add a global.rum section to the custom-values.yaml file:

    global:
  rum:
    enabled: true
    yaml

    To add session replay storage, merge a sessionReplayStorage block into this same global.rum section — see RUM Session Replay Storage: AWS S3, RUM Session Replay Storage: Azure Blob, or RUM Session Replay Storage: Google GCS for the storage-specific fields.

  2. Add the RUM Kafka topics to the global.kafkaTopics list in the custom-values.yaml file, alongside your existing topics.

    Use the configuration for the events stream as a reference for the number of replicas and partitions.

    global:
  kafkaTopics:
    # ... your existing topics ...
    - name: kf_rum_session_replay_topic
      partitions: 3
      replicationFactor: 2
    - name: kf_rum_views_topic
      partitions: 3
      replicationFactor: 2
    - name: kf_rum_actions_topic
      partitions: 3
      replicationFactor: 2
    - name: kf_rum_resources_topic
      partitions: 3
      replicationFactor: 2
    - name: kf_rum_longtasks_topic
      partitions: 3
      replicationFactor: 2
    - name: kf_rum_errors_topic
      partitions: 3
      replicationFactor: 2
    yaml

  3. Specify the TLS configuration in the tls section of the custom-values.yaml file, and ensure you use a public host.

    tls:
  enabled: true (1)
  host: <your-public-hostname> (2)
  email: <certificate-contact-email>
  clusterIssuer: <your-cluster-issuer>
    yaml
    1 enabled: true: Enable TLS.
    2 host: the public hostname that browsers send RUM data to.

  4. Specify the Ingress configuration in the ingress section of the custom-values.yaml file.

    RUM must have a public ingest endpoint where the frontend browser posts data.

    ingress:
  controller:
    service:
      external:
        enabled: true (1)
      externalTrafficPolicy: Local (2)
    yaml
    1 external.enabled: expose the ingress controller outside the cluster.
    2 externalTrafficPolicy: Local: send external traffic only to nodes that run the ingress controller, which preserves the client IP address.

  5. Enable RUM in the ingester section of the custom-values.yaml file:

    ingester:
  config:
    rum:
      enabled: true
      # Default value, shown for reference; you can omit it.
      datadog:
        proxyToDatadogEnabled: false
    yaml

  6. To ingest frontend logs into Kloudfuse, add parsing rules to logs-parser.kf_parsing_config.config in the custom-values.yaml file.

    Include these rules verbatim, along with your existing rules.

    logs-parser:
  kf_parsing_config:
    config: |-
      # ... your existing rules ...
      - remap:
          args:
            kf_additional_tags:
              - "$.origin"
              - "$.application_id"
              - "$.session_id"
              - "$.view.id"
              - "$.view.url"
              - "$.view.referrer"
              - "$.error.handling"
              - "$.error.kind"
              - "$.error.stack"
              - "$.error.message"
              - "$.http.method"
              - "$.http.status_code"
              - "$.http.url"
          conditions:
            - matcher: "__kf_agent"
              value: "datadog"
              op: "=="
      - transform:
          args:
            - action: "replace"
            - sourceLabels: "#ddsource"
            - targetLabel: "source"
          conditions:
            - matcher: "#__kf_ddrum"
              value: "true"
              op: "=="
      - moveLabelToFacet:
          args:
            - name: "error.kind"
            - facetName: "error_kind"
            - agentFacet: true
          conditions:
            - matcher: "#__kf_ddrum"
              value: "true"
              op: "=="
      - moveLabelToFacet:
          args:
            - name: "error.stack"
            - facetName: "error_stack"
            - agentFacet: true
          conditions:
            - matcher: "#__kf_ddrum"
              value: "true"
              op: "=="
      - moveLabelToFacet:
          args:
            - name: "error.message"
            - facetName: "error_message"
            - agentFacet: true
          conditions:
            - matcher: "#__kf_ddrum"
              value: "true"
              op: "=="
      - moveLabelToFacet:
          args:
            - name: "http.method"
            - facetName: "@http_method"
            - agentFacet: true
          conditions:
            - matcher: "#__kf_ddrum"
              value: "true"
              op: "=="
      - moveLabelToFacet:
          args:
            - name: "http.status_code"
            - facetName: "http_status_code"
            - agentFacet: true
          conditions:
            - matcher: "#__kf_ddrum"
              value: "true"
              op: "=="
      - moveLabelToFacet:
          args:
            - name: "http.url"
            - facetName: "http_url"
            - agentFacet: true
          conditions:
            - matcher: "#__kf_ddrum"
              value: "true"
              op: "=="
      - moveLabelToFacet:
          args:
            - name: "session_id"
            - facetName: "sessionid"
            - agentFacet: true
          conditions:
            - matcher: "#__kf_ddrum"
              value: "true"
              op: "=="
      - moveLabelToFacet:
          args:
            - name: "application_id"
            - facetName: "applicationid"
            - agentFacet: true
          conditions:
            - matcher: "#__kf_ddrum"
              value: "true"
              op: "=="
      - moveLabelToFacet:
          args:
            - name: "view.url"
            - facetName: "view_url"
            - agentFacet: true
          conditions:
            - matcher: "#__kf_ddrum"
              value: "true"
              op: "=="
      - moveLabelToFacet:
          args:
            - name: "view.referrer"
            - facetName: "view_referrer"
            - agentFacet: true
          conditions:
            - matcher: "#__kf_ddrum"
              value: "true"
              op: "=="
      - moveLabelToFacet:
          args:
            - name: "view.id"
            - facetName: "view_id"
            - agentFacet: true
          conditions:
            - matcher: "#__kf_ddrum"
              value: "true"
              op: "=="
      - moveLabelToFacet:
          args:
            - name: "error.handling"
            - facetName: "@error_handling"
            - agentFacet: true
          conditions:
            - matcher: "#__kf_ddrum"
              value: "true"
              op: "=="
      - moveLabelToFacet:
          args:
            - name: "origin"
            - facetName: "event_origin"
            - agentFacet: true
          conditions:
            - matcher: "#__kf_ddrum"
              value: "true"
              op: "=="
    yaml

  7. Enable RUM under global.uiConfig in the custom-values.yaml file:

    global:
  uiConfig:
    rum:
      enabled: true
    yaml

  8. Apply the changes with a Helm upgrade, and confirm that all pods are running:

    helm upgrade --install kfuse oci://us-east1-docker.pkg.dev/mvp-demo-301906/kfuse-helm/kfuse \
  -n kfuse \
  --version <VERSION> \ (1)
  -f custom-values.yaml
    bash
    1 Replace <VERSION> with a valid Kloudfuse release value. See Release Notes for the latest release.

  9. In the Kloudfuse UI, create your RUM application and note its application ID. You use this ID when you initialize the frontend SDK. See RUM Applications.

Instrument the Frontend Application

To set up the Frontend SDK for RUM, see instructions in RUM Setup.

Configure these parameters when you initialize the SDK:

applicationId

applicationId: '<APPLICATION_ID>'

Must match the ID of the RUM application you created in the Kloudfuse UI. See RUM Applications.

clientToken

clientToken: '<CLIENT_TOKEN>'

Use the string dummy if your Kloudfuse installation doesn’t have authenticated ingestion enabled. If it does, see Enable Authenticated Ingestion.

site

site: '<SITE>'

Use empty string.

proxy

proxy: '<KFUSE_RUM_ENDPOINT>'

Must be of the form https://<your-kloudfuse-hostname>/ddrumproxy.

Example: https://kloudfuse.example.com/ddrumproxy.

service

service: '<APPLICATION_NAME>'

Must match the application name, and cannot contain any white space.

Example: kf-frontend

env

env: 'production'

This value depends on the type of deployment: test, production, staging, and so on.

version

version: '1.0.0'

If the frontend application has an identifier, use a string value that represents the version.

Otherwise, use the default value of 1.0.0.

sessionSampleRate

sessionSampleRate: 100

Lower it on high-traffic sites to reduce the volume of RUM data.

enableSessionRecording

enableSessionRecording: true

We recommend a value of true to use the session capture and replay feature.

enableLogCollection

enableLogCollection: true

We recommend a value of true to get frontend logs into your Kloudfuse cluster.

Enable Authenticated Ingestion

(Optional)

By default, this feature is disabled.

When you enable authenticated ingestion on the Kloudfuse platform, you must enable it globally, and add authentication tokens.

Follow these steps:

  1. To enable ingestion authentication, set global.authConfig.enabled to true in the custom-values.yaml file:

    Enable Ingestion Authentication
    global:
  authConfig:
    enabled: true (1)
    yaml
    1 authConfig: enable

  2. Generate a new authentication token:

    Generate token
    uuidgen | tr -d '-' | tr 'A-Z' 'a-z' | sed 's/^/pub/'

  3. Configure one or more client tokens in the ingester config rum section of the custom-values.yaml file:

    Configure tokens
    ingester:
  config:
    rum:
      enabled: true (1)
      clientTokens: (2)
        - rumauthkey1: <unique authtoken value>
        - rumauthkey2: <unique authtoken value>
    yaml
    1 enabled: Enable RUM ingestion
    2 clientTokens rumauthkey1 and rumauthkey2: Unique authentication tokens for RUM, generated in Generate token.

  4. Match the generated auth tokens to the clientToken value in the frontend RUM SDK configuration:

    kfuseRumSDK.init({
    config: {
        applicationId: '<application id>', (1)
        clientToken: '<unique authtoken value>', (2)
        ...
    }
})
    javascript
    1 applicationId: The identifier of the service that provides the RUM stream.
    2 clientToken: Unique authentication token for RUM, generated in Generate token, matching the declarations in Configure tokens.

Add or update RUM labels used for RBAC policies

(Optional)

By default the chart uses the following RUM RBAC labels: application.id, service, env, geo.country_iso_code.

To add or update the labels used by RUM RBAC policies, edit the rumRBACLabels array in your custom-values.yaml under the global section.

Example:

global:
  rumRBACLabels: ["application.id", "service", "env", "geo.country_iso_code", "<<new_label>>"]
yaml

Notes

  • While the labels are configurable it is recommended to only add attributes that have constant value across whole session.