The same code, two environments ....

[MartinNovak1991]

Please answer these questions before submitting a bug report.

What version of OpenTelemetry are you using?

"@opentelemetry/api": "^0.21.0",
"@opentelemetry/context-zone": "^0.21.0",
"@opentelemetry/exporter-collector": "^0.21.0",
"@opentelemetry/instrumentation": "^0.21.0",
"@opentelemetry/instrumentation-document-load": "^0.21.0",
"@opentelemetry/instrumentation-fetch": "^0.21.0",
"@opentelemetry/instrumentation-user-interaction": "^0.21.0",
"@opentelemetry/instrumentation-xml-http-request": "^0.21.0",
"@opentelemetry/metrics": "^0.21.0",
"@opentelemetry/propagator-b3": "^0.21.0",
"@opentelemetry/tracing": "^0.21.0",
"@opentelemetry/web": "^0.21.0",

What version of Node are you using?

 Not Node

Please provide the code you used to setup the OpenTelemetry SDK

export const COLLECTOR_OPTIONS = {
url: "https://otel-collector-opentelemetry.apps.os23v02.dctest.slsp.sk/v1/traces",
serviceName: "FENiX_OPENTELEMETRY",
attributes: { "deployment.environment": "development" },
};

export const MyTracer = () => {

const provider = new WebTracerProvider();
provider.addSpanProcessor(new SimpleSpanProcessor(new CollectorTraceExporter(COLLECTOR_OPTIONS)));
provider.addSpanProcessor(new SimpleSpanProcessor(new ConsoleSpanExporter()));

var tracer = provider.getTracer(TRACER_NAME, TRACER_VERSION);
// var span: any;
/* provider.register({
    // Changing default contextManager to use ZoneContextManager - supports asynchronous operations - optional
    //contextManager: new ZoneContextManager(),
    propagator: new B3Propagator(),
});*/

provider.register();

registerInstrumentations({
    instrumentations: [
        new FetchInstrumentation({
            ignoreUrls: [], ///localhost:8090\/sockjs-node/
            clearTimingResources: true,
        }),
        new UserInteractionInstrumentation(),
        new XMLHttpRequestInstrumentation(),
    ],
    tracerProvider: trace,
});

async function getUser(userId: number) {
    const span1 = tracer.startSpan("SELECT ShopDb.Users", {
        attributes: {
            "net.peer.name": "shopdb.example.com",
            "net.peer.ip": "192.0.2.12",
            "net.peer.port": 3306,
            "net.transport": "IP.TCP",
            "db.name": "ShopDb",
        },
        kind: SpanKind.CLIENT,
    });

    await new Promise((resolve, reject) => {
        setTimeout(resolve, 6000);
    });
    console.log("endDB");
    span1.end();
    return "user_end";
}

const start = async () => {
    const span1 = tracer.startSpan(`GET /user/:id`, {
        attributes: {
            "http.method": "GET",
            "http.flavor": "1.1",
            "http.url": "request.url",
            "net.peer.ip": "192.0.2.5",
        },
        kind: SpanKind.CLIENT,
    });
    const ctx = setSpan(context.active(), span1);
    const user = await context.with(ctx, getUser, undefined, 123);
    span1.end();
    console.log(user);
};

const stopSpan = () => {
    // span.end();
};

return (
    <>
        <Button  onClick={() => { start(); }} >
            start-trans
        </Button>
        <Button   onClick={() => {console.log("5555"); stopSpan();  }} >
            end
        </Button>
    </>
);

};

What did you do?

Its about SPA - single page app running on ReactJS (bundle.js is build on serverside) ... I made React component to handle (test) manual trace and spans to check wrapping a many async request (in this case fake asnyc - using setTimeout()) to the one. If I run project on local environment (http), it sends payload to collectors URL, but if I deploy project (same code, no change) to test-development (https), it sends empty request-payload, watch this:

{"resourceSpans":[]}

instead of localhost:

{"resourceSpans":[{"resource":{"attributes":[{"key":"deployment.environment","value":{"stringValue":"development"}},{"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":"0.21.0"}}],"droppedAttributesCount":0},"instrumentationLibrarySpans":[{"spans":[{"traceId":"ff26ac5e9d475ce88011a2a215f9c178","spanId":"de47853bea28bd6d","name":"GET /user/:id","kind":3,"startTimeUnixNano":1627898907683800000,"endTimeUnixNano":1627898913745699800,"attributes":[{"key":"http.method","value":{"stringValue":"GET"}},{"key":"http.flavor","value":{"stringValue":"1.1"}},{"key":"http.url","value":{"stringValue":"request.url"}},{"key":"net.peer.ip","value":{"stringValue":"192.0.2.5"}}],"droppedAttributesCount":0,"events":[],"droppedEventsCount":0,"status":{"code":0},"links":[],"droppedLinksCount":0}],"instrumentationLibrary":{"name":"XXX_tracer","version":"0.1.0"}}]}]}

But...! In both cases ConsoleSpanExporter logs the same output (IDs are different, I know ... this is a sample for imagine):

{traceId: "36bab0de15349c058b1802c9e7afc81c", parentId: "ac97d0b8f1bfc037", name: "SELECT ShopDb.Users", id: "e76a5a6f53b09c8f", kind: 2, …}

{traceId: "36bab0de15349c058b1802c9e7afc81c", parentId: undefined, name: "GET /user/:id", id: "ac97d0b8f1bfc037", kind: 2, …}

Why the same code has two different payloads?
I dont understand .... Do I need some special config?

What did you expect to see?

Same output -> request-payload

What did you see instead?

Two different payloads -> localhost=CONTAINS_DATA, test-environment=EMPTY

Additional context

[MartinNovak1991]

Any idea?

[dyladan]

I can't think of anything that would cause this. There isn't really enough info here to effectively debug. Can you provide a reproduction?

[MartinNovak1991]

There is nothing to reproduce ... Behavior is immutable.

The same piece of code (comment above) gives two different payloads. If I run this code on localhost (on my PC), consoleExporter writes data to console correctly, collectorExporter sends data to collector pretty correctly. But if I run this code on remote server (running on HTTPS), consoleExporter writes data to console correctly too, BUT collectorExporter sends nothing, no data, empty payload.

I would like to trace from webpage, but this is not possible with this piece of code. This code above just simulates XHR request with async func with setTimeout(). I will attach some screenshots in short time ...

[MartinNovak1991]

Here is possible to see consoleExporter data and collectorExporter payloads from localhost instance:

and here the same code on remote server seen in my browser:

After clicking "start-trans" button ... theres fired async task .... after 6seconds ... browser does POST collected data (traces) -> localhost OK, remote-server NOT_OK

[dyladan]

@obecny any idea? This is a weird one

[dyladan]

My best guess is that it has something to do with your build process. Perhaps the production build is stripping something important.

[obecny]

This is weird but this might be related to your server and how the browser treats cross domain requests and headers. That would be the first thing to check, I dont see if browser is doing preflight request and if so what is the whole request and response that is coming from yr servers. If server doesn't set cors and allow all headers that are being used many unpredictable things could happen. Can you take also the latest version 0.24.x ?

[MartinNovak1991]

Please, check this: #1887

I found out OT function is intercepted, but Im not able to debug a breaking point because of missing source-maps.

[dyladan]

I created a PR to inline sources in maps #2488

[github-actions]

This issue is stale because it has been open 60 days with no activity. Remove stale label or comment or this will be closed in 14 days.

[github-actions]

This issue was closed because it has been stale for 14 days with no activity.