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

yaohongkok · 2023-10-12T20:05:05Z

What happened?

Steps to Reproduce

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"

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

Clone this repo and go into examples/opentelemetry-web.
Run npm install and npm run.
Visit http://localhost:8090/fetch/ and click on 'Test'.
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://[email protected]/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	[email protected]/telemetry.go:84	Setting up own telemetry...
2023-10-12T19:32:20.328Z	info	[email protected]/telemetry.go:201	Serving Prometheus metrics	{"address": ":8888", "level": "Basic"}
2023-10-12T19:32:20.335Z	info	[email protected]/exporter.go:275	Development component. May change in the future.	{"kind": "exporter", "data_type": "traces", "name": "debug"}
2023-10-12T19:32:20.340Z	debug	[email protected]/receiver.go:294	Stable component.{"kind": "receiver", "name": "otlp", "data_type": "traces"}
2023-10-12T19:32:20.343Z	info	[email protected]/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	[email protected]/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	[email protected]/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	[email protected]/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

The text was updated successfully, but these errors were encountered:

lingyan · 2023-10-12T20:13:29Z

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.

yaohongkok · 2023-10-12T20:20:22Z

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

lingyan · 2023-10-12T20:22:39Z

@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 · 2023-10-16T20:03:54Z

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 · 2023-10-16T21:21:33Z

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 · 2023-10-17T11:43:42Z

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 · 2023-10-18T13:22:26Z

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 🤔

lingyan · 2023-10-19T04:54:09Z

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

seemk · 2023-10-24T10:44:15Z

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: #4220

joshmeads · 2023-10-26T05:45:15Z

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 · 2023-10-26T06:14:05Z

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 · 2023-10-27T13:42:04Z

#4202 (comment)

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

mateusz-lisik · 2023-10-29T19:00:51Z

#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 · 2023-10-30T15:08:43Z

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 · 2023-10-30T15:17:14Z

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: #4220

cristianmadularu · 2023-10-30T15:19:09Z

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

seemk · 2023-10-30T15:22:43Z

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 🤔

cristianmadularu · 2023-10-30T15:25:30Z

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

bpsgit · 2023-10-31T04:31:54Z

#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 · 2023-11-01T13:29:53Z

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

cristianmadularu · 2023-11-01T13:36:51Z

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

Welcome to the club :)

cristianmadularu · 2023-11-01T13:39:09Z

#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 · 2023-11-14T17:38:08Z

Hello any progress?

cristianmadularu · 2023-11-14T17:39:07Z

Hello any progress?

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

yaohongkok added bug Something isn't working triage labels Oct 12, 2023

shauns added a commit to Shopify/cli that referenced this issue Oct 13, 2023

Downgrade otel library due to open-telemetry/opentelemetry-js#4202

da09786

lingyan mentioned this issue Oct 16, 2023

fix(otlp-transformer): avoid precision loss when converting HrTime to unix nanoseconds #4062

Merged

4 tasks

pichlermarc added priority:p2 Bugs and spec inconsistencies which cause telemetry to be incomplete or incorrect and removed triage labels Oct 17, 2023

pichlermarc assigned seemk Oct 17, 2023

myrotvorets-team mentioned this issue Oct 21, 2023

chore(deps): update dependency @opentelemetry/exporter-trace-otlp-http to ^0.44.0 myrotvorets/n.identigraf.center#1235

Closed

1 task

lextas mentioned this issue Oct 27, 2023

@opentelemetry/exporter-trace-otlp-http sends time as an object #4216

Closed

codecapitano mentioned this issue Nov 24, 2023

chore: upgrade otel deps grafana/faro-web-sdk#391

Merged

3 tasks

pichlermarc closed this as completed Dec 20, 2023

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

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

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

yaohongkok commented Oct 12, 2023 •

edited

Loading

lingyan commented Oct 12, 2023 •

edited

Loading

yaohongkok commented Oct 12, 2023

lingyan commented Oct 12, 2023

seemk commented Oct 16, 2023

evantorrie commented Oct 16, 2023

pichlermarc commented Oct 17, 2023

seemk commented Oct 18, 2023 •

edited

Loading

lingyan commented Oct 19, 2023

seemk commented Oct 24, 2023

joshmeads commented Oct 26, 2023

vpmedia commented Oct 26, 2023

bpsgit commented Oct 27, 2023

mateusz-lisik commented Oct 29, 2023

cristianmadularu commented Oct 30, 2023

seemk commented Oct 30, 2023

cristianmadularu commented Oct 30, 2023

seemk commented Oct 30, 2023

cristianmadularu commented Oct 30, 2023

bpsgit commented Oct 31, 2023

clyncha commented Nov 1, 2023

cristianmadularu commented Nov 1, 2023

cristianmadularu commented Nov 1, 2023

clyncha commented Nov 14, 2023

cristianmadularu commented Nov 14, 2023

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

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

Comments

yaohongkok commented Oct 12, 2023 • edited Loading

What happened?

Steps to Reproduce

Expected Result

Actual Result

Additional Details

OpenTelemetry Setup Code

package.json

Relevant log output

lingyan commented Oct 12, 2023 • edited Loading

yaohongkok commented Oct 12, 2023

lingyan commented Oct 12, 2023

seemk commented Oct 16, 2023

evantorrie commented Oct 16, 2023

pichlermarc commented Oct 17, 2023

seemk commented Oct 18, 2023 • edited Loading

lingyan commented Oct 19, 2023

seemk commented Oct 24, 2023

joshmeads commented Oct 26, 2023

vpmedia commented Oct 26, 2023

bpsgit commented Oct 27, 2023

mateusz-lisik commented Oct 29, 2023

cristianmadularu commented Oct 30, 2023

seemk commented Oct 30, 2023

cristianmadularu commented Oct 30, 2023

seemk commented Oct 30, 2023

cristianmadularu commented Oct 30, 2023

bpsgit commented Oct 31, 2023

clyncha commented Nov 1, 2023

cristianmadularu commented Nov 1, 2023

cristianmadularu commented Nov 1, 2023

clyncha commented Nov 14, 2023

cristianmadularu commented Nov 14, 2023

yaohongkok commented Oct 12, 2023 •

edited

Loading

lingyan commented Oct 12, 2023 •

edited

Loading

seemk commented Oct 18, 2023 •

edited

Loading