search

open-telemetry / opentelemetry-js

OpenTelemetry JavaScript Client
https://opentelemetry.io
Apache License 2.0
2.72k stars 792 forks source link

Unable to send trace data to collector using 'examples/opentelemetry-web' #4202

Closed yaohongkok closed 10 months ago

yaohongkok commented 1 year ago

What happened?

Steps to Reproduce

1) Set up the collector as follows:

receivers:
  otlp:
    protocols:
      http:
        endpoint: "0.0.0.0:4318"
        cors:
          allowed_origins:
            - http://localhost:8080
            - http://localhost:8090

exporters:
  debug:
    verbosity: normal
    sampling_initial: 1
    sampling_thereafter: 1

service:
  # extensions: [health_check, pprof, zpages]
  pipelines:
    traces:
      receivers: [otlp]
      exporters: [debug]
  telemetry:
    logs:
      level: "debug"

2) Run the collector:

docker run -v $(pwd)/otel_config.yml:/etc/otelcol-contrib/config.yaml -p 4318:4318 otel/opentelemetry-collector-contrib:0.87.0-armv7

3) Clone this repo and go into examples/opentelemetry-web.

4) Run npm install and npm run.

5) Visit http://localhost:8090/fetch/ and click on 'Test'.

6) Open up the developer console and under the Network tab, you will see /traces responding with 400s.

Expected Result

The POST /traces requests should succeed.

Actual Result

The POST /traces requests receives a 400 Bad Request. The response is:

{
    "code": 3,
    "message": "ReadUint64: unsupported value type, error found in #10 byte of ...|UnixNano\":{\"low\":102|..., bigger context ...|1\",\"name\":\"HTTP GET\",\"kind\":3,\"startTimeUnixNano\":{\"low\":1029784000,\"high\":395146000},\"endTimeUnixNa|..."
}

The request looks smth as follows:

{
  "resourceSpans": [
    {
      "resource": {
        "attributes": [
          {
            "key": "service.name",
            "value": {
              "stringValue": "unknown_service"
            }
          },
          {
            "key": "telemetry.sdk.language",
            "value": {
              "stringValue": "webjs"
            }
          },
          {
            "key": "telemetry.sdk.name",
            "value": {
              "stringValue": "opentelemetry"
            }
          },
          {
            "key": "telemetry.sdk.version",
            "value": {
              "stringValue": "1.17.1"
            }
          }
        ],
        "droppedAttributesCount": 0
      },
      "scopeSpans": [
        {
          "scope": {
            "name": "@opentelemetry/instrumentation-fetch",
            "version": "0.44.0"
          },
          "spans": [
            {
              "traceId": "b6d98f8d3db156c41479a10dcec7acad",
              "spanId": "d56edc49226cec35",
              "parentSpanId": "dfad940e2086e9c1",
              "name": "HTTP GET",
              "kind": 3,
              "startTimeUnixNano": {
                "low": 1029784000,
                "high": 395146000
              },
              "endTimeUnixNano": {
                "low": 1098784000,
                "high": 395146000
              },
              "attributes": [
                {
                  "key": "component",
                  "value": {
                    "stringValue": "fetch"
                  }
                },
                {
                  "key": "http.method",
                  "value": {
                    "stringValue": "GET"
                  }
                },
                {
                  "key": "http.url",
                  "value": {
                    "stringValue": "https://httpbin.org/get"
                  }
                },
                {
                  "key": "http.status_code",
                  "value": {
                    "intValue": 200
                  }
                },
                {
                  "key": "http.status_text",
                  "value": {
                    "stringValue": ""
                  }
                },
                {
                  "key": "http.host",
                  "value": {
                    "stringValue": "httpbin.org"
                  }
                },
                {
                  "key": "http.scheme",
                  "value": {
                    "stringValue": "https"
                  }
                },
                {
                  "key": "http.user_agent",
                  "value": {
                    "stringValue": "Mozilla/5.0 (Macintosh; Intel Mac OS X 10_15_7) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/117.0.0.0 Safari/537.36"
                  }
                },
                {
                  "key": "http.response_content_length",
                  "value": {
                    "intValue": 0
                  }
                }
              ],
              "droppedAttributesCount": 0,
              "events": [
                {
                  "attributes": [],
                  "name": "fetchStart",
                  "timeUnixNano": {
                    "low": 1029984001,
                    "high": 395146000
                  },
                  "droppedAttributesCount": 0
                },
                {
                  "attributes": [],
                  "name": "domainLookupStart",
                  "timeUnixNano": {
                    "low": -956532928,
                    "high": 395145867
                  },
                  "droppedAttributesCount": 0
                },
                {
                  "attributes": [],
                  "name": "domainLookupEnd",
                  "timeUnixNano": {
                    "low": -956532928,
                    "high": 395145867
                  },
                  "droppedAttributesCount": 0
                },
                {
                  "attributes": [],
                  "name": "connectStart",
                  "timeUnixNano": {
                    "low": -956532928,
                    "high": 395145867
                  },
                  "droppedAttributesCount": 0
                },
                {
                  "attributes": [],
                  "name": "secureConnectionStart",
                  "timeUnixNano": {
                    "low": -956532928,
                    "high": 395145867
                  },
                  "droppedAttributesCount": 0
                },
                {
                  "attributes": [],
                  "name": "connectEnd",
                  "timeUnixNano": {
                    "low": -956532928,
                    "high": 395145867
                  },
                  "droppedAttributesCount": 0
                },
                {
                  "attributes": [],
                  "name": "requestStart",
                  "timeUnixNano": {
                    "low": -956532928,
                    "high": 395145867
                  },
                  "droppedAttributesCount": 0
                },
                {
                  "attributes": [],
                  "name": "responseStart",
                  "timeUnixNano": {
                    "low": -956532928,
                    "high": 395145867
                  },
                  "droppedAttributesCount": 0
                },
                {
                  "attributes": [],
                  "name": "responseEnd",
                  "timeUnixNano": {
                    "low": 1094484001,
                    "high": 395146000
                  },
                  "droppedAttributesCount": 0
                }
              ],
              "droppedEventsCount": 0,
              "status": {
                "code": 0
              },
              "links": [],
              "droppedLinksCount": 0
            }
          ]
        }
      ]
    }
  ]
}

Additional Details

I suspect this error has something to do with the negative numbers. But, I don't understand enough about the proper behavior of unsigned_long.js.

I am on an ARM Mac and I am not sure if this could be the cause of this issue? I know that my colleague is able to use opentelemetry-js without much problem.

OpenTelemetry Setup Code

// Directly from the example fetch/index.js

const { context, trace } = require( '@opentelemetry/api');
const { ConsoleSpanExporter, SimpleSpanProcessor } = require( '@opentelemetry/sdk-trace-base');
const { OTLPTraceExporter } = require( '@opentelemetry/exporter-trace-otlp-http');
const { WebTracerProvider } = require( '@opentelemetry/sdk-trace-web');
const { FetchInstrumentation } = require( '@opentelemetry/instrumentation-fetch');
const { ZoneContextManager } = require( '@opentelemetry/context-zone');
const { B3Propagator } = require( '@opentelemetry/propagator-b3');
const { registerInstrumentations } = require( '@opentelemetry/instrumentation');

const provider = new WebTracerProvider();

// Note: For production consider using the "BatchSpanProcessor" to reduce the number of requests
// to your exporter. Using the SimpleSpanProcessor here as it sends the spans immediately to the
// exporter without delay
provider.addSpanProcessor(new SimpleSpanProcessor(new ConsoleSpanExporter()));
provider.addSpanProcessor(new SimpleSpanProcessor(new OTLPTraceExporter()));
provider.register({
  contextManager: new ZoneContextManager(),
  propagator: new B3Propagator(),
});

registerInstrumentations({
  instrumentations: [
    new FetchInstrumentation({
      ignoreUrls: [/localhost:8090\/sockjs-node/],
      propagateTraceHeaderCorsUrls: [
        'https://cors-test.appspot.com/test',
        'https://httpbin.org/get',
      ],
      clearTimingResources: true,
    }),
  ],
});

const webTracerWithZone = provider.getTracer('example-tracer-web');

const getData = (url) => fetch(url, {
  method: 'GET',
  headers: {
    Accept: 'application/json',
    'Content-Type': 'application/json',
  },
});

// example of keeping track of context between async operations
const prepareClickEvent = () => {
  const url = 'https://httpbin.org/get';

  const element = document.getElementById('button1');

  const onClick = () => {
    const singleSpan = webTracerWithZone.startSpan('files-series-info');
    context.with(trace.setSpan(context.active(), singleSpan), () => {
      getData(url).then((_data) => {
        trace.getSpan(context.active()).addEvent('fetching-single-span-completed');
        singleSpan.end();
      });
    });
    for (let i = 0, j = 5; i < j; i += 1) {
      const span = webTracerWithZone.startSpan(`files-series-info-${i}`);
      context.with(trace.setSpan(context.active(), span), () => {
        getData(url).then((_data) => {
          trace.getSpan(context.active()).addEvent(`fetching-span-${i}-completed`);
          span.end();
        });
      });
    }
  };
  element.addEventListener('click', onClick);
};

window.addEventListener('load', prepareClickEvent);

package.json

{
  "name": "web-opentelemetry-example",
  "private": true,
  "version": "0.44.0",
  "description": "Example of using @opentelemetry/sdk-trace-web and @opentelemetry/sdk-metrics in browser",
  "main": "index.js",
  "scripts": {
    "start": "webpack serve --progress --color --port 8090 --config webpack.dev.config.js --hot --host 0.0.0.0 --compress",
    "start-nc": "webpack serve --progress --color --port 8090 --config webpack.dev.config.js --hot --host 0.0.0.0 --no-compress",
    "start-prod": "webpack serve --progress --color --port 8090 --config webpack.prod.config.js --hot --host 0.0.0.0 --compress",
    "start-prodnc": "webpack serve --progress --color --port 8090 --config webpack.prod.config.js --hot --host 0.0.0.0 --no-compress",
    "docker:start": "cd ./docker && docker-compose down && docker-compose up",
    "docker:startd": "cd ./docker && docker-compose down && docker-compose up -d",
    "docker:stop": "cd ./docker && docker-compose down"
  },
  "repository": {
    "type": "git",
    "url": "git+ssh://git@github.com/open-telemetry/opentelemetry-js.git"
  },
  "keywords": [
    "opentelemetry",
    "tracing",
    "metrics",
    "web"
  ],
  "engines": {
    "node": ">=14"
  },
  "author": "OpenTelemetry Authors",
  "license": "Apache-2.0",
  "bugs": {
    "url": "https://github.com/open-telemetry/opentelemetry-js/issues"
  },
  "devDependencies": {
    "@babel/core": "^7.6.0",
    "babel-loader": "^8.0.6",
    "ts-loader": "^9.2.6",
    "typescript": "^4.5.2",
    "webpack": "^5.65.0",
    "webpack-cli": "^4.10.0",
    "webpack-dev-server": "^4.5.0",
    "webpack-merge": "^5.8.0"
  },
  "dependencies": {
    "@opentelemetry/api": "^1.3.0",
    "@opentelemetry/context-zone": "1.17.1",
    "@opentelemetry/core": "1.17.1",
    "@opentelemetry/exporter-metrics-otlp-http": "0.44.0",
    "@opentelemetry/exporter-trace-otlp-http": "0.44.0",
    "@opentelemetry/exporter-trace-otlp-proto": "0.44.0",
    "@opentelemetry/exporter-zipkin": "1.17.1",
    "@opentelemetry/instrumentation": "0.44.0",
    "@opentelemetry/instrumentation-fetch": "0.44.0",
    "@opentelemetry/instrumentation-xml-http-request": "0.44.0",
    "@opentelemetry/propagator-b3": "1.17.1",
    "@opentelemetry/sdk-metrics": "1.17.1",
    "@opentelemetry/sdk-trace-base": "1.17.1",
    "@opentelemetry/sdk-trace-web": "1.17.1",
    "@opentelemetry/semantic-conventions": "1.17.1"
  },
  "homepage": "https://github.com/open-telemetry/opentelemetry-js/tree/main/examples/tracer-web"
}

Relevant log output

On the collector side, these are the output:

WARNING: The requested image's platform (linux/arm/v7) does not match the detected host platform (linux/arm64/v8) and no specific platform was requested
2023-10-12T19:32:20.321Z    info    service@v0.87.0/telemetry.go:84 Setting up own telemetry...
2023-10-12T19:32:20.328Z    info    service@v0.87.0/telemetry.go:201    Serving Prometheus metrics  {"address": ":8888", "level": "Basic"}
2023-10-12T19:32:20.335Z    info    exporter@v0.87.0/exporter.go:275    Development component. May change in the future.    {"kind": "exporter", "data_type": "traces", "name": "debug"}
2023-10-12T19:32:20.340Z    debug   receiver@v0.87.0/receiver.go:294    Stable component.{"kind": "receiver", "name": "otlp", "data_type": "traces"}
2023-10-12T19:32:20.343Z    info    service@v0.87.0/service.go:143  Starting otelcol-contrib... {"Version": "0.87.0", "NumCPU": 5}
2023-10-12T19:32:20.343Z    info    extensions/extensions.go:33 Starting extensions...
2023-10-12T19:32:20.344Z    warn    internal@v0.87.0/warning.go:40  Using the 0.0.0.0 address exposes this server to every network interface, which may facilitate Denial of Service attacks    {"kind": "receiver", "name": "otlp", "data_type": "traces", "documentation": "https://github.com/open-telemetry/opentelemetry-collector/blob/main/docs/security-best-practices.md#safeguards-against-denial-of-service-attacks"}
2023-10-12T19:32:20.345Z    info    otlpreceiver@v0.87.0/otlp.go:101    Starting HTTP server    {"kind": "receiver", "name": "otlp", "data_type": "traces", "endpoint": "0.0.0.0:4318"}
2023-10-12T19:32:20.346Z    info    service@v0.87.0/service.go:169  Everything is ready. Begin running and processing data.

On the client side:

[webpack-dev-server] Server started: Hot Module Replacement enabled, Live Reloading enabled, Progress disabled, Overlay enabled.
log.js:39 [HMR] Waiting for update signal from WDS...
ConsoleSpanExporter.js:88 Object
ConsoleSpanExporter.js:88 Object
ConsoleSpanExporter.js:88 Object
ConsoleSpanExporter.js:88 Object
ConsoleSpanExporter.js:88 Object
ConsoleSpanExporter.js:88 Object
ConsoleSpanExporter.js:88 Object
util.js:55     POST http://localhost:4318/v1/traces 400 (Bad Request)
sendWithBeacon @ util.js:55
eval @ OTLPExporterBrowserBase.js:77
ZoneAwarePromise @ zone.js:1429
OTLPExporterBrowserBase.send @ OTLPExporterBrowserBase.js:72
eval @ OTLPExporterBase.js:76
ZoneAwarePromise @ zone.js:1429
OTLPExporterBase._export @ OTLPExporterBase.js:73
OTLPExporterBase.export @ OTLPExporterBase.js:63
eval @ exporter.js:26
invoke @ zone.js:372
run @ zone.js:134
ZoneContextManager.with @ ZoneContextManager.js:219
ContextAPI.with @ context.js:88
eval @ exporter.js:25
ZoneAwarePromise @ zone.js:1429
_export @ exporter.js:23
doExport @ SimpleSpanProcessor.js:98
SimpleSpanProcessor.onEnd @ SimpleSpanProcessor.js:123
MultiSpanProcessor.onEnd @ MultiSpanProcessor.js:84
Span.end @ Span.js:190
eval @ index.js:64
invoke @ zone.js:372
run @ zone.js:134
eval @ zone.js:1275
invokeTask @ zone.js:406
runTask @ zone.js:178
drainMicroTaskQueue @ zone.js:585
Promise.then (async)
nativeScheduleMicroTask @ zone.js:561
scheduleMicroTask @ zone.js:572
scheduleTask @ zone.js:396
scheduleTask @ zone.js:221
scheduleMicroTask @ zone.js:241
scheduleResolveOrReject @ zone.js:1265
resolvePromise @ zone.js:1202
eval @ zone.js:1118
eval @ zone.js:1134
Promise.then (async)
eval @ zone.js:1509
ZoneAwarePromise @ zone.js:1429
Ctor.then @ zone.js:1508
eval @ fetch.js:304
invoke @ zone.js:372
run @ zone.js:134
ZoneContextManager.with @ ZoneContextManager.js:219
ContextAPI.with @ context.js:88
eval @ fetch.js:297
ZoneAwarePromise @ zone.js:1429
patchConstructor @ fetch.js:296
getData @ index.js:37
eval @ index.js:62
invoke @ zone.js:372
run @ zone.js:134
ZoneContextManager.with @ ZoneContextManager.js:219
ContextAPI.with @ context.js:88
onClick @ index.js:61
invokeTask @ zone.js:406
runTask @ zone.js:178
invokeTask @ zone.js:487
invokeTask @ zone.js:1661
globalCallback @ zone.js:1692
globalZoneAwareCallback @ zone.js:1725
util.js:55     POST http://localhost:4318/v1/traces 400 (Bad Request)
sendWithBeacon @ util.js:55
eval @ OTLPExporterBrowserBase.js:77
ZoneAwarePromise @ zone.js:1429
OTLPExporterBrowserBase.send @ OTLPExporterBrowserBase.js:72
eval @ OTLPExporterBase.js:76
ZoneAwarePromise @ zone.js:1429
OTLPExporterBase._export @ OTLPExporterBase.js:73
OTLPExporterBase.export @ OTLPExporterBase.js:63
eval @ exporter.js:26
invoke @ zone.js:372
run @ zone.js:134
ZoneContextManager.with @ ZoneContextManager.js:219
ContextAPI.with @ context.js:88
eval @ exporter.js:25
ZoneAwarePromise @ zone.js:1429
_export @ exporter.js:23
doExport @ SimpleSpanProcessor.js:98
SimpleSpanProcessor.onEnd @ SimpleSpanProcessor.js:123
MultiSpanProcessor.onEnd @ MultiSpanProcessor.js:84
Span.end @ Span.js:190
eval @ index.js:56
invoke @ zone.js:372
run @ zone.js:134
eval @ zone.js:1275
invokeTask @ zone.js:406
runTask @ zone.js:178
drainMicroTaskQueue @ zone.js:585
Promise.then (async)
nativeScheduleMicroTask @ zone.js:561
scheduleMicroTask @ zone.js:572
scheduleTask @ zone.js:396
scheduleTask @ zone.js:221
scheduleMicroTask @ zone.js:241
scheduleResolveOrReject @ zone.js:1265
resolvePromise @ zone.js:1202
eval @ zone.js:1118
eval @ zone.js:1134
Promise.then (async)
eval @ zone.js:1509
ZoneAwarePromise @ zone.js:1429
Ctor.then @ zone.js:1508
eval @ fetch.js:304
invoke @ zone.js:372
run @ zone.js:134
ZoneContextManager.with @ ZoneContextManager.js:219
ContextAPI.with @ context.js:88
eval @ fetch.js:297
ZoneAwarePromise @ zone.js:1429
patchConstructor @ fetch.js:296
getData @ index.js:37
eval @ index.js:54
invoke @ zone.js:372
run @ zone.js:134
ZoneContextManager.with @ ZoneContextManager.js:219
ContextAPI.with @ context.js:88
onClick @ index.js:53
invokeTask @ zone.js:406
runTask @ zone.js:178
invokeTask @ zone.js:487
invokeTask @ zone.js:1661
globalCallback @ zone.js:1692
globalZoneAwareCallback @ zone.js:1725
util.js:55     POST http://localhost:4318/v1/traces 400 (Bad Request)
sendWithBeacon @ util.js:55
eval @ OTLPExporterBrowserBase.js:77
ZoneAwarePromise @ zone.js:1429
OTLPExporterBrowserBase.send @ OTLPExporterBrowserBase.js:72
eval @ OTLPExporterBase.js:76
ZoneAwarePromise @ zone.js:1429
OTLPExporterBase._export @ OTLPExporterBase.js:73
OTLPExporterBase.export @ OTLPExporterBase.js:63
eval @ exporter.js:26
invoke @ zone.js:372
run @ zone.js:134
ZoneContextManager.with @ ZoneContextManager.js:219
ContextAPI.with @ context.js:88
eval @ exporter.js:25
ZoneAwarePromise @ zone.js:1429
_export @ exporter.js:23
doExport @ SimpleSpanProcessor.js:98
SimpleSpanProcessor.onEnd @ SimpleSpanProcessor.js:123
MultiSpanProcessor.onEnd @ MultiSpanProcessor.js:84
Span.end @ Span.js:190
eval @ index.js:64
invoke @ zone.js:372
run @ zone.js:134
eval @ zone.js:1275
invokeTask @ zone.js:406
runTask @ zone.js:178
drainMicroTaskQueue @ zone.js:585
Promise.then (async)
nativeScheduleMicroTask @ zone.js:561
scheduleMicroTask @ zone.js:572
scheduleTask @ zone.js:396
scheduleTask @ zone.js:221
scheduleMicroTask @ zone.js:241
scheduleResolveOrReject @ zone.js:1265
resolvePromise @ zone.js:1202
eval @ zone.js:1118
eval @ zone.js:1134
Promise.then (async)
eval @ zone.js:1509
ZoneAwarePromise @ zone.js:1429
Ctor.then @ zone.js:1508
eval @ fetch.js:304
invoke @ zone.js:372
run @ zone.js:134
ZoneContextManager.with @ ZoneContextManager.js:219
ContextAPI.with @ context.js:88
eval @ fetch.js:297
ZoneAwarePromise @ zone.js:1429
patchConstructor @ fetch.js:296
getData @ index.js:37
eval @ index.js:62
invoke @ zone.js:372
run @ zone.js:134
ZoneContextManager.with @ ZoneContextManager.js:219
ContextAPI.with @ context.js:88
onClick @ index.js:61
invokeTask @ zone.js:406
runTask @ zone.js:178
invokeTask @ zone.js:487
invokeTask @ zone.js:1661
globalCallback @ zone.js:1692
globalZoneAwareCallback @ zone.js:1725
util.js:55     POST http://localhost:4318/v1/traces 400 (Bad Request)
sendWithBeacon @ util.js:55
eval @ OTLPExporterBrowserBase.js:77
ZoneAwarePromise @ zone.js:1429
OTLPExporterBrowserBase.send @ OTLPExporterBrowserBase.js:72
eval @ OTLPExporterBase.js:76
ZoneAwarePromise @ zone.js:1429
OTLPExporterBase._export @ OTLPExporterBase.js:73
OTLPExporterBase.export @ OTLPExporterBase.js:63
eval @ exporter.js:26
invoke @ zone.js:372
run @ zone.js:134
ZoneContextManager.with @ ZoneContextManager.js:219
ContextAPI.with @ context.js:88
eval @ exporter.js:25
ZoneAwarePromise @ zone.js:1429
_export @ exporter.js:23
doExport @ SimpleSpanProcessor.js:98
SimpleSpanProcessor.onEnd @ SimpleSpanProcessor.js:123
MultiSpanProcessor.onEnd @ MultiSpanProcessor.js:84
Span.end @ Span.js:190
eval @ index.js:64
invoke @ zone.js:372
run @ zone.js:134
eval @ zone.js:1275
invokeTask @ zone.js:406
runTask @ zone.js:178
drainMicroTaskQueue @ zone.js:585
Promise.then (async)
nativeScheduleMicroTask @ zone.js:561
scheduleMicroTask @ zone.js:572
scheduleTask @ zone.js:396
scheduleTask @ zone.js:221
scheduleMicroTask @ zone.js:241
scheduleResolveOrReject @ zone.js:1265
resolvePromise @ zone.js:1202
eval @ zone.js:1118
eval @ zone.js:1134
Promise.then (async)
eval @ zone.js:1509
ZoneAwarePromise @ zone.js:1429
Ctor.then @ zone.js:1508
eval @ fetch.js:304
invoke @ zone.js:372
run @ zone.js:134
ZoneContextManager.with @ ZoneContextManager.js:219
ContextAPI.with @ context.js:88
eval @ fetch.js:297
ZoneAwarePromise @ zone.js:1429
patchConstructor @ fetch.js:296
getData @ index.js:37
eval @ index.js:62
invoke @ zone.js:372
run @ zone.js:134
ZoneContextManager.with @ ZoneContextManager.js:219
ContextAPI.with @ context.js:88
onClick @ index.js:61
invokeTask @ zone.js:406
runTask @ zone.js:178
invokeTask @ zone.js:487
invokeTask @ zone.js:1661
globalCallback @ zone.js:1692
globalZoneAwareCallback @ zone.js:1725
util.js:55     POST http://localhost:4318/v1/traces 400 (Bad Request)
sendWithBeacon @ util.js:55
eval @ OTLPExporterBrowserBase.js:77
ZoneAwarePromise @ zone.js:1429
OTLPExporterBrowserBase.send @ OTLPExporterBrowserBase.js:72
eval @ OTLPExporterBase.js:76
ZoneAwarePromise @ zone.js:1429
OTLPExporterBase._export @ OTLPExporterBase.js:73
OTLPExporterBase.export @ OTLPExporterBase.js:63
eval @ exporter.js:26
invoke @ zone.js:372
run @ zone.js:134
ZoneContextManager.with @ ZoneContextManager.js:219
ContextAPI.with @ context.js:88
eval @ exporter.js:25
ZoneAwarePromise @ zone.js:1429
_export @ exporter.js:23
doExport @ SimpleSpanProcessor.js:98
SimpleSpanProcessor.onEnd @ SimpleSpanProcessor.js:123
MultiSpanProcessor.onEnd @ MultiSpanProcessor.js:84
Span.end @ Span.js:190
eval @ index.js:64
invoke @ zone.js:372
run @ zone.js:134
eval @ zone.js:1275
invokeTask @ zone.js:406
runTask @ zone.js:178
drainMicroTaskQueue @ zone.js:585
Promise.then (async)
nativeScheduleMicroTask @ zone.js:561
scheduleMicroTask @ zone.js:572
scheduleTask @ zone.js:396
scheduleTask @ zone.js:221
scheduleMicroTask @ zone.js:241
scheduleResolveOrReject @ zone.js:1265
resolvePromise @ zone.js:1202
eval @ zone.js:1118
eval @ zone.js:1134
Promise.then (async)
eval @ zone.js:1509
ZoneAwarePromise @ zone.js:1429
Ctor.then @ zone.js:1508
eval @ fetch.js:304
invoke @ zone.js:372
run @ zone.js:134
ZoneContextManager.with @ ZoneContextManager.js:219
ContextAPI.with @ context.js:88
eval @ fetch.js:297
ZoneAwarePromise @ zone.js:1429
patchConstructor @ fetch.js:296
getData @ index.js:37
eval @ index.js:62
invoke @ zone.js:372
run @ zone.js:134
ZoneContextManager.with @ ZoneContextManager.js:219
ContextAPI.with @ context.js:88
onClick @ index.js:61
invokeTask @ zone.js:406
runTask @ zone.js:178
invokeTask @ zone.js:487
invokeTask @ zone.js:1661
globalCallback @ zone.js:1692
globalZoneAwareCallback @ zone.js:1725
util.js:55     POST http://localhost:4318/v1/traces 400 (Bad Request)
sendWithBeacon @ util.js:55
eval @ OTLPExporterBrowserBase.js:77
ZoneAwarePromise @ zone.js:1429
OTLPExporterBrowserBase.send @ OTLPExporterBrowserBase.js:72
eval @ OTLPExporterBase.js:76
ZoneAwarePromise @ zone.js:1429
OTLPExporterBase._export @ OTLPExporterBase.js:73
OTLPExporterBase.export @ OTLPExporterBase.js:63
eval @ exporter.js:26
invoke @ zone.js:372
run @ zone.js:134
ZoneContextManager.with @ ZoneContextManager.js:219
ContextAPI.with @ context.js:88
eval @ exporter.js:25
ZoneAwarePromise @ zone.js:1429
_export @ exporter.js:23
doExport @ SimpleSpanProcessor.js:98
SimpleSpanProcessor.onEnd @ SimpleSpanProcessor.js:123
MultiSpanProcessor.onEnd @ MultiSpanProcessor.js:84
Span.end @ Span.js:190
eval @ index.js:64
invoke @ zone.js:372
run @ zone.js:134
eval @ zone.js:1275
invokeTask @ zone.js:406
runTask @ zone.js:178
drainMicroTaskQueue @ zone.js:585
Promise.then (async)
nativeScheduleMicroTask @ zone.js:561
scheduleMicroTask @ zone.js:572
scheduleTask @ zone.js:396
scheduleTask @ zone.js:221
scheduleMicroTask @ zone.js:241
scheduleResolveOrReject @ zone.js:1265
resolvePromise @ zone.js:1202
eval @ zone.js:1118
eval @ zone.js:1134
Promise.then (async)
eval @ zone.js:1509
ZoneAwarePromise @ zone.js:1429
Ctor.then @ zone.js:1508
eval @ fetch.js:304
invoke @ zone.js:372
run @ zone.js:134
ZoneContextManager.with @ ZoneContextManager.js:219
ContextAPI.with @ context.js:88
eval @ fetch.js:297
ZoneAwarePromise @ zone.js:1429
patchConstructor @ fetch.js:296
getData @ index.js:37
eval @ index.js:62
invoke @ zone.js:372
run @ zone.js:134
ZoneContextManager.with @ ZoneContextManager.js:219
ContextAPI.with @ context.js:88
onClick @ index.js:61
invokeTask @ zone.js:406
runTask @ zone.js:178
invokeTask @ zone.js:487
invokeTask @ zone.js:1661
globalCallback @ zone.js:1692
globalZoneAwareCallback @ zone.js:1725
util.js:55     POST http://localhost:4318/v1/traces 400 (Bad Request)
sendWithBeacon @ util.js:55
eval @ OTLPExporterBrowserBase.js:77
ZoneAwarePromise @ zone.js:1429
OTLPExporterBrowserBase.send @ OTLPExporterBrowserBase.js:72
eval @ OTLPExporterBase.js:76
ZoneAwarePromise @ zone.js:1429
OTLPExporterBase._export @ OTLPExporterBase.js:73
OTLPExporterBase.export @ OTLPExporterBase.js:63
eval @ exporter.js:26
invoke @ zone.js:372
run @ zone.js:134
ZoneContextManager.with @ ZoneContextManager.js:219
ContextAPI.with @ context.js:88
eval @ exporter.js:25
ZoneAwarePromise @ zone.js:1429
_export @ exporter.js:23
doExport @ SimpleSpanProcessor.js:98
SimpleSpanProcessor.onEnd @ SimpleSpanProcessor.js:123
MultiSpanProcessor.onEnd @ MultiSpanProcessor.js:84
Span.end @ Span.js:190
eval @ fetch.js:213
timer @ zone.js:2405
invokeTask @ zone.js:406
runTask @ zone.js:178
invokeTask @ zone.js:487
ZoneTask.invoke @ zone.js:476
data.args.<computed> @ zone.js:2385
setTimeout (async)
scheduleTask @ zone.js:2387
scheduleTask @ zone.js:393
scheduleTask @ zone.js:221
scheduleMacroTask @ zone.js:244
scheduleMacroTaskWithCurrentZone @ zone.js:683
eval @ zone.js:2429
proto.<computed> @ zone.js:973
FetchInstrumentation._endSpan @ fetch.js:207
endSpanOnSuccess @ fetch.js:247
eval @ fetch.js:268
invoke @ zone.js:372
run @ zone.js:134
eval @ zone.js:1275
invokeTask @ zone.js:406
runTask @ zone.js:178
drainMicroTaskQueue @ zone.js:585
Promise.then (async)
nativeScheduleMicroTask @ zone.js:561
scheduleMicroTask @ zone.js:572
scheduleTask @ zone.js:396
scheduleTask @ zone.js:221
scheduleMicroTask @ zone.js:241
scheduleResolveOrReject @ zone.js:1265
resolvePromise @ zone.js:1202
eval @ zone.js:1118
eval @ zone.js:1134
Promise.then (async)
eval @ zone.js:1509
ZoneAwarePromise @ zone.js:1429
Ctor.then @ zone.js:1508
read_1 @ fetch.js:265
eval @ fetch.js:271
invoke @ zone.js:372
run @ zone.js:134
eval @ zone.js:1275
invokeTask @ zone.js:406
runTask @ zone.js:178
drainMicroTaskQueue @ zone.js:585
Promise.then (async)
nativeScheduleMicroTask @ zone.js:561
scheduleMicroTask @ zone.js:572
scheduleTask @ zone.js:396
scheduleTask @ zone.js:221
scheduleMicroTask @ zone.js:241
scheduleResolveOrReject @ zone.js:1265
resolvePromise @ zone.js:1202
eval @ zone.js:1118
eval @ zone.js:1134
Promise.then (async)
eval @ zone.js:1509
ZoneAwarePromise @ zone.js:1429
Ctor.then @ zone.js:1508
read_1 @ fetch.js:265
onSuccess @ fetch.js:277
invoke @ zone.js:372
run @ zone.js:134
eval @ zone.js:1275
invokeTask @ zone.js:406
runTask @ zone.js:178
drainMicroTaskQueue @ zone.js:585
Promise.then (async)
nativeScheduleMicroTask @ zone.js:561
scheduleMicroTask @ zone.js:572
scheduleTask @ zone.js:396
scheduleTask @ zone.js:221
scheduleMicroTask @ zone.js:241
scheduleResolveOrReject @ zone.js:1265
resolvePromise @ zone.js:1202
eval @ zone.js:1118
eval @ zone.js:1134
Promise.then (async)
eval @ zone.js:1509
ZoneAwarePromise @ zone.js:1429
Ctor.then @ zone.js:1508
eval @ fetch.js:304
invoke @ zone.js:372
run @ zone.js:134
ZoneContextManager.with @ ZoneContextManager.js:219
ContextAPI.with @ context.js:88
eval @ fetch.js:297
ZoneAwarePromise @ zone.js:1429
patchConstructor @ fetch.js:296
getData @ index.js:37
eval @ index.js:62
invoke @ zone.js:372
run @ zone.js:134
ZoneContextManager.with @ ZoneContextManager.js:219
ContextAPI.with @ context.js:88
onClick @ index.js:61
invokeTask @ zone.js:406
runTask @ zone.js:178
invokeTask @ zone.js:487
invokeTask @ zone.js:1661
globalCallback @ zone.js:1692
globalZoneAwareCallback @ zone.js:1725
ConsoleSpanExporter.js:88
lingyan commented 1 year ago

I'm seeing the same issue, and it seems to be related to this change: https://github.com/open-telemetry/opentelemetry-js/pull/4062/

The startTimeUnixNano and endTimeUnixNano are serialized as an object, e.g. {"low":1045401984,"high":395145071}, instead of number or string, therefore collector can not parse it, hence throwing the ReadUint64: unsupported value type error: https://github.com/open-telemetry/opentelemetry-collector/blob/main/pdata/internal/json/number.go#L71-L86

Based on the parser code, serializing the 64bit value to a string (instead of the object with low high fields) would solve this issue.

yaohongkok commented 1 year ago

@lingyan Is there an older release of this open-telemetry-js that I could run without running into this issue?

lingyan commented 1 year ago

@lingyan Is there an older release of this open-telemetry-js that I could run without running into this issue?

If you can, try downgrading @opentelemetry/exporter-trace-otlp-http to 0.43.0 for now.

seemk commented 1 year ago

I'm seeing the same issue, and it seems to be related to this change: #4062

The startTimeUnixNano and endTimeUnixNano are serialized as an object, e.g. {"low":1045401984,"high":395145071}, instead of number or string, therefore collector can not parse it, hence throwing the ReadUint64: unsupported value type error: https://github.com/open-telemetry/opentelemetry-collector/blob/main/pdata/internal/json/number.go#L71-L86

Based on the parser code, serializing the 64bit value to a string (instead of the object with low high fields) would solve this issue.

The JSON encoding went unnoticed in my PR, where the intermediate types were are serialized directly with JSON.stringify in the HTTP exporter. The conversion code needs another flag (e.g. to serialize fixed64 to strings). I'll try to get a fix in tomorrow.

evantorrie commented 1 year ago

One thing to consider is whether CI should run some sort of functional test where the output from NodeJS exporters are sent to an OpenTelemetry Collector - and ensure that the data is parsed and collected correctly.

Such a test would have failed before the original PR #4062 was merged.

pichlermarc commented 1 year ago

I'm seeing the same issue, and it seems to be related to this change: #4062 The startTimeUnixNano and endTimeUnixNano are serialized as an object, e.g. {"low":1045401984,"high":395145071}, instead of number or string, therefore collector can not parse it, hence throwing the ReadUint64: unsupported value type error: open-telemetry/opentelemetry-collector@main/pdata/internal/json/number.go#L71-L86 Based on the parser code, serializing the 64bit value to a string (instead of the object with low high fields) would solve this issue.

The JSON encoding went unnoticed in my PR, where the intermediate types were are serialized directly with JSON.stringify in the HTTP exporter. The conversion code needs another flag (e.g. to serialize fixed64 to strings). I'll try to get a fix in tomorrow.

Thank you for picking this up @seemk

One thing to consider is whether CI should run some sort of functional test where the output from NodeJS exporters are sent to an OpenTelemetry Collector - and ensure that the data is parsed and collected correctly.

Such a test would have failed before the original PR #4062 was merged.

Agreed, we should have something like this. There's #2157 to track this. I added it to the Exporter GA Milestone.

seemk commented 1 year ago

Adding toString from long.js would pretty much bring in most of the library.

Wonder if it'd make sense to copy long.js to this codebase instead of copying only the relevant parts.

Another option would be to encode fixed64 as numbers in the JSON exporter, but this means the precision error is back.

I'm for just copying over long.js (as far as I know it can't be added as a dependency due to ESM), but this would cause the package size to go up and I think the JSON exporter is mostly used in browsers :thinking:

lingyan commented 1 year ago

Is using JavaScript's built-int BigInt type an option?

seemk commented 12 months ago

Is using JavaScript's built-int BigInt type an option?

Went with the BigInt route with a fallback to the old imprecise (doesn't really matter for browsers anyway) numeric value in case BigInt isn't available: https://github.com/open-telemetry/opentelemetry-js/pull/4220

joshmeads commented 12 months ago

This was quite the debug session to find the issue. Errors coming from the tools we used weren't helpful.

Give this appears to be a broken release (i assume) could a patch be released or retag latest on npm to 0.43.0? Personally it was my first time using OTEL and without a change log or anything to go off this was very hard to pin down.

vpmedia commented 12 months ago

This was quite the debug session to find the issue. Errors coming from the tools we used weren't helpful.

Give this appears to be a broken release (i assume) could a patch be released or retag latest on npm to 0.43.0? Personally it was my first time using OTEL and without a change log or anything to go off this was very hard to pin down.

+1 for releasing emergency patches in these cases

bpsgit commented 12 months ago

https://github.com/open-telemetry/opentelemetry-js/issues/4202#issuecomment-1760315879

This didnt work ... any other alternative fix available?

mateusz-lisik commented 11 months ago

#4202 (comment)

This didnt work ... any other alternative fix available?

Downgrade everything that's 0.44.0 to 0.43.0, this helped me

cristianmadularu commented 11 months ago

Hi all, any traction with this issue? Since it is a major break in functionality, if we believe that having a fix might require more time, I recommend reverting the change that introduced it and re-release asap. As it is now, the 0.44 version can't be used and there is no indication in any documentation of that fact.

seemk commented 11 months ago

Hi all, any traction with this issue? Since it is a major break in functionality, if we believe that having a fix might require more time, I recommend reverting the change that introduced it and re-release asap. As it is now, the 0.44 version can't be used and there is no indication in any documentation of that fact.

The fix has been in a PR state for a while: https://github.com/open-telemetry/opentelemetry-js/pull/4220

cristianmadularu commented 11 months ago

Thanks @seemk What is preventing a merge? I see some unit tests failing. Is that ok?

seemk commented 11 months ago

Thanks @seemk What is preventing a merge? I see some unit tests failing. Is that ok?

Looks like all PRs have the same issue currently: https://github.com/open-telemetry/opentelemetry-js/pulls :thinking:

cristianmadularu commented 11 months ago

@pichlermarc seems to be out of office. I wonder who else could approve this and generate a new release.

bpsgit commented 11 months ago

#4202 (comment) This didnt work ... any other alternative fix available?

Downgrade everything that's 0.44.0 to 0.43.0, this helped me

Thanks @mateusz-lisik .. didnt work

Downgraded these to 0.43.0

@opentelemetry/exporter-trace-otlp-http, @opentelemetry/instrumentation

but still facing the same issue

clyncha commented 11 months ago

Any updates on this? It is blocking a project I'm working on.

cristianmadularu commented 11 months ago

Any updates on this? It is blocking a project I'm working on.

Welcome to the club :)

cristianmadularu commented 11 months ago

#4202 (comment) This didnt work ... any other alternative fix available?

Downgrade everything that's 0.44.0 to 0.43.0, this helped me

0.43 does not have this issue but it has another bug (fixed in 0.44) where the library cannot be used from a WebWorker.

clyncha commented 11 months ago

Hello any progress?

cristianmadularu commented 11 months ago

Hello any progress?

They fixed it. I tested the latest version and it works well.