Node.js 测试从web应用程序到api的opentelemetry

Node.js 测试从web应用程序到api的opentelemetry,node.js,typescript,open-telemetry,Node.js,Typescript,Open Telemetry,我有一个web应用程序APPA,它调用一个web服务主应用程序,它调用另一个web服务从应用程序。为了记录这些痕迹,我正在使用opentelemetry。当master调用slave时,我可以在Jaeger中看到跟踪,但当web应用程序调用master时,我看到只有web应用程序被调用,没有跟踪与web服务相关,我可以分别看到来自相关的两个web服务的跟踪: 但当我无法访问web应用程序时,我只能看到web应用程序的痕迹,而不是所有3个组件: 以下是我在web应用程序中所做的操作: impo

我有一个web应用程序APPA,它调用一个web服务主应用程序,它调用另一个web服务从应用程序。为了记录这些痕迹,我正在使用opentelemetry。当master调用slave时,我可以在Jaeger中看到跟踪,但当web应用程序调用master时,我看到只有web应用程序被调用,没有跟踪与web服务相关,我可以分别看到来自相关的两个web服务的跟踪:

但当我无法访问web应用程序时,我只能看到web应用程序的痕迹,而不是所有3个组件:

以下是我在web应用程序中所做的操作:

import { context, getSpan, setSpan } from '@opentelemetry/api';
import { ConsoleSpanExporter, SimpleSpanProcessor } from '@opentelemetry/tracing';
import { CollectorTraceExporter } from '@opentelemetry/exporter-collector';
import { WebTracerProvider } from '@opentelemetry/web';
import { FetchInstrumentation } from '@opentelemetry/instrumentation-fetch';
import { ZoneContextManager } from '@opentelemetry/context-zone';
import { B3Propagator } from '@opentelemetry/propagator-b3';
import { registerInstrumentations } from '@opentelemetry/instrumentation';

const provider = new WebTracerProvider();

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

provider.addSpanProcessor(new SimpleSpanProcessor(new ConsoleSpanExporter()));
provider.addSpanProcessor(new SimpleSpanProcessor(new CollectorTraceExporter({
  serviceName: 'nodejs-opentelemetry-web-fetch',
  url: 'http://localhost:55681/v1/traces'
})));
provider.register({
  contextManager: new ZoneContextManager(),
  propagator: new B3Propagator(),
});

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 = 'http://localhost:3000';

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

  const onClick = () => {
    const singleSpan = webTracerWithZone.startSpan(`files-series-info`);
    context.with(setSpan(context.active(), singleSpan), () => {
      getData(url).then((_data) => {
        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(setSpan(context.active(), span), () => {
        getData(url).then((_data) => {
          getSpan(context.active()).addEvent(`fetching-span-${i}-completed`);
          span.end();
        });
      });
    }
  };
  element.addEventListener('click', onClick);
};

window.addEventListener('load', prepareClickEvent);
从'@opentelemetry/api'导入{context,getSpan,setSpan};
从“@opentelemetry/tracing”导入{ConsoleSpanExporter,SimpleSpanProcessor};
从'@opentelemetry/exporter-collector'导入{CollectorTraceExporter};
从“@opentelemetry/web”导入{WebTracerProvider};
从'@opentelemetry/instrumentation fetch'导入{FetchInstrumentation};
从“@opentelemetry/context zone”导入{ZoneContextManager};
从'@opentelemetry/propagator-b3'导入{B3Propagator};
从'@opentelemetry/instrumentation'导入{registerInstrumentations};
const provider=new WebTracerProvider();
注册仪器({
仪器:[
新仪器({
IgnoreURL:[/localhost:8090\/sockjs node/],
传播TraceHeaderCorsURL:[
'https://cors-test.appspot.com/test',
'https://httpbin.org/get',
],
clearTimingResources:正确
}),
],
追踪提供者:提供者,
});
addSpanProcessor(新的SimplePanProcessor(新的ConsolePanExporter());
provider.addSpanProcessor(新SimpleSpanProcessor)(新CollectorTraceExporter({
serviceName:'nodejs opentelemetry web fetch',
网址:'http://localhost:55681/v1/traces'
})));
提供者注册({
contextManager:new ZoneContextManager(),
传播程序:新的B3传播程序(),
});
const-webTracerWithZone=provider.getTracer('example-tracer-web');
const getData=(url)=>fetch(url{
方法:“GET”,
标题:{
“接受”:“应用程序/json”,
“内容类型”:“应用程序/json”,
},
});
//在异步操作之间跟踪上下文的示例
const prepareClickEvent=()=>{
常量url=http://localhost:3000';
常量元素=document.getElementById('button1');
const onClick=()=>{
const singleSpan=webTracerWithZone.startSpan(`files series info`);
context.with(setSpan(context.active(),singleSpan),()=>{
获取数据(url)。然后(_数据)=>{
getSpan(context.active()).addEvent('fetching-single-span-completed');
singleSpan.end();
});
});
对于(设i=0,j=5;i{
获取数据(url)。然后(_数据)=>{
getSpan(context.active()).addEvent(`fetching span-${i}-completed`);
span.end();
});
});
}
};
元素。addEventListener('click',onClick);
};
window.addEventListener('load',PrepareClickeEvent);
我在对所有3个组件进行共扼时做错了什么