diff --git a/docs/services/frontend.md b/docs/services/frontend.md index d2d6bf194c..9727a37368 100644 --- a/docs/services/frontend.md +++ b/docs/services/frontend.md @@ -118,6 +118,11 @@ and register web specific auto-instrumentation libraries. Since the browser will send data to an OpenTelemetry collector that will likely be on a separate domain, CORS headers are also setup accordingly. +As part of the changes to carry over the `synthetic_request` attribute flag for +the backend services, the `applyCustomAttributesOnSpan` configuration function +has been added to the `instrumentation-fetch` library custom span attributes logic +that way every browser-side span will include it. + ```typescript import { CompositePropagator, W3CBaggagePropagator, W3CTraceContextPropagator } from '@opentelemetry/core'; import { WebTracerProvider } from '@opentelemetry/sdk-trace-web'; @@ -155,6 +160,9 @@ const FrontendTracer = async () => { '@opentelemetry/instrumentation-fetch': { propagateTraceHeaderCorsUrls: /.*/, clearTimingResources: true, + applyCustomAttributesOnSpan(span) { + span.setAttribute('app.synthetic_request', 'false'); + }, }, }), ], diff --git a/src/frontend/utils/telemetry/FrontendTracer.ts b/src/frontend/utils/telemetry/FrontendTracer.ts index 8ad93a9489..e8bf0090a2 100644 --- a/src/frontend/utils/telemetry/FrontendTracer.ts +++ b/src/frontend/utils/telemetry/FrontendTracer.ts @@ -43,6 +43,9 @@ const FrontendTracer = async (collectorString: string) => { '@opentelemetry/instrumentation-fetch': { propagateTraceHeaderCorsUrls: /.*/, clearTimingResources: true, + applyCustomAttributesOnSpan(span) { + span.setAttribute('app.synthetic_request', 'false'); + }, }, }), ], diff --git a/src/frontend/utils/telemetry/Instrumentation.js b/src/frontend/utils/telemetry/Instrumentation.js index 6efec0a4f7..31c09a8468 100644 --- a/src/frontend/utils/telemetry/Instrumentation.js +++ b/src/frontend/utils/telemetry/Instrumentation.js @@ -1,15 +1,15 @@ -const opentelemetry = require("@opentelemetry/sdk-node") -const { getNodeAutoInstrumentations } = require("@opentelemetry/auto-instrumentations-node") -const { OTLPTraceExporter } = require('@opentelemetry/exporter-trace-otlp-grpc') -const { alibabaCloudEcsDetector } = require('@opentelemetry/resource-detector-alibaba-cloud') -const { awsEc2Detector, awsEksDetector } = require('@opentelemetry/resource-detector-aws') -const { containerDetector } = require('@opentelemetry/resource-detector-container') -const { gcpDetector } = require('@opentelemetry/resource-detector-gcp') -const { envDetector, hostDetector, osDetector, processDetector } = require('@opentelemetry/resources') +const opentelemetry = require('@opentelemetry/sdk-node'); +const { getNodeAutoInstrumentations } = require('@opentelemetry/auto-instrumentations-node'); +const { OTLPTraceExporter } = require('@opentelemetry/exporter-trace-otlp-grpc'); +const { alibabaCloudEcsDetector } = require('@opentelemetry/resource-detector-alibaba-cloud'); +const { awsEc2Detector, awsEksDetector } = require('@opentelemetry/resource-detector-aws'); +const { containerDetector } = require('@opentelemetry/resource-detector-container'); +const { gcpDetector } = require('@opentelemetry/resource-detector-gcp'); +const { envDetector, hostDetector, osDetector, processDetector } = require('@opentelemetry/resources'); const sdk = new opentelemetry.NodeSDK({ traceExporter: new OTLPTraceExporter(), - instrumentations: [ getNodeAutoInstrumentations() ], + instrumentations: [getNodeAutoInstrumentations()], resourceDetectors: [ containerDetector, envDetector, @@ -19,8 +19,8 @@ const sdk = new opentelemetry.NodeSDK({ alibabaCloudEcsDetector, awsEksDetector, awsEc2Detector, - gcpDetector - ] -}) + gcpDetector, + ], +}); -sdk.start() +sdk.start();