jaegertracing / jaeger-ui

Web UI for Jaeger
http://jaegertracing.io/
Apache License 2.0
1.12k stars 477 forks source link

[Fun task]: Add React tracing #1307

Open yurishkuro opened 1 year ago

yurishkuro commented 1 year ago

Requirement

Understand and visualize the behavior of Jaeger UI via traces

Problem

Currently we only start traces at the query service.

Proposal

Perhaps follow suggestions in the blog?

https://developers.redhat.com/articles/2023/03/22/how-enable-opentelemetry-traces-react-applications

or this one

https://www.cncf.io/blog/2024/08/05/how-to-add-otel-instrumentation-to-a-react-native-app/

Open questions

How can we send trace data from the browser to Jaeger backend? Should the query-service implement a dedicated endpoint where frontend can report traces?

psk001 commented 1 year ago

Hi @yurishkuro , is it up for grab can I start on it ?

yurishkuro commented 1 year ago

@psk001 yes

psk001 commented 1 year ago

Thanks @yurishkuro. I followed the mentioned article and was able to get traces using jaeger all-in-one For the exporter, a URL is required to send traces to collector

const collectorExporter = new OTLPTraceExporter({
// url:""
  headers: {}
});

Without a given value, it defaults to localhost. Is there a collector URL that can be added here?

yurishkuro commented 1 year ago

All-in-one listens on port 4318 for OTLP over HHTP.