Correlate RUM traces with OpenTelemetry backends

KloudMate’s RUM lets you connect requests from your web apps to their related backend traces. This integration provides a unified view of your frontend and backend data, so you can identify issues throughout your stack and understand your users’ experience.

If you want to propagate these headers to a different origin, it can be configured at initialization.

For example, if you want to propagate trace context headers to https://api.example.com, the RUM SDK would be initialized as shown below:

KloudMateRum.init({
  endpoint: 'https://otel.kloudmate.dev:4318',
  rumAccessToken: '<YOUR_PUBLIC_API_KEY>',
  applicationName: 'my-app',
  version: '1',
  deploymentEnvironment: 'prod',
  sessionRecorder: {
      enabled: true,
  }
  instrumentations: {
    fetch: {
      propagateTraceHeaderCorsUrls: [new RegExp('https://api.example.com.*')]
    },
    xhr: {
      propagateTraceHeaderCorsUrls: [new RegExp('https://api.example.com.*')]
    }
  }
});

This will add context propagation headers to backend requests. The backend can then generate its spans using this context.

Sample Integration:

Once the RUM and backend are integrated you can view the corresponding backend trace of a frontend request

2. You can identify the same in APM traces

Correlate RUM traces with OpenTelemetry backends

Related Resources