Repository files navigation

Moved to thelogfire-js monorepo

The example showcases how a fetch request initiated from the browser can propagate to the server and then to a third-party service, all while being instrumented with OpenTelemetry. The example uses the Logfire OTel SDK for both the client and server sides.

• TheClientInstrumentationProvider is a client-only component that instruments the browser fetch.
• To avoid exposing the write token, the middleware.ts proxies the logfire/v1/traces request.
• The instrumentation.ts file is the standard@vercel/otel setup.
• The.env should look like this:

OTEL_EXPORTER_OTLP_TRACES_ENDPOINT=https://logfire-api.pydantic.dev/v1/tracesOTEL_EXPORTER_OTLP_METRICS_ENDPOINT=https://logfire-api.pydantic.dev/v1/metricsOTEL_EXPORTER_OTLP_HEADERS='Authorization=your-token'LOGFIRE_TOKEN='your-token'

NOTE: alternatively, if you're not sure about the connection between the client and the server, you can host the proxy at a different location (e.g. Cloudflare).