与可观测链路 OpenTelemetry 版前后端打通 - 应用实时监控服务ARMS

在前端监控中，即便已知API的请求耗时，也无从知晓准确的网络传输性能、后端服务的调用链路及性能，因而无法快速准确地排查应用API问题。前后端链路追踪功能可以解决此类问题，它会将API请求从前端发出到后端调用的链路串联起来，真实还原代码执行的完整现场。

前提条件

您需要先通过npm方式安装探针，具体操作，请参见以npm方式接入前端监控。

背景信息

默认前端监控和应用监控都是自动打通的，通过前端监控和会话追踪都能查看端到端的请求追踪数据。当您使用OpenTracing协议（开源Trace ID，即uber-trace-id）的情况下，需要您手动将前端监控的JavaScript配置与可观测链路 OpenTelemetry 版前后端打通。在调用链路页签下，调用链路追踪表格展示每次调用的详情，列包括应用名、日志产生时间、状态、IP地址、调用类型、服务名、方法栈、线程剖析和时间轴（单位：毫秒）。例如，一条调用类型为前端的请求耗时 30889 毫秒且状态异常（红色圆点），其对应的HTTP入口调用耗时 68964 毫秒且状态正常（绿色圆点）。可单击方法栈或线程剖析列的放大镜图标查看详细信息。

配置参数

当您通过npm方式安装探针时，需要完成以下参数配置。

const BrowserLogger = require('alife-logger');
const __bl = BrowserLogger.singleton({
    pid:"xxx",     // 站点ID
    appType:"web",
    enableLinkTrace:true,
    linkType: 'tracing', // 链路追踪类型：默认为arms，使用ARMS私有协议，会传EagleEye开头的几个header；可以改为tracing，即使用jaeger协议，会传uber-trace-id这个header
    enableApiCors: true  // 是否允许请求跨域及自定义header，默认值为false，设置为true后则需要后端服务支持
});

enableApiCors:true ：需要后端服务支持请求跨域及自定义header值，否则请求会失败，如以下报错信息所示。

[WDS] Live Reloading enabled.                                              client:52
Access to fetch at 'http://xxx.xxx.xxx.155:9000/api' from origin 'http://127.0.0.1:9000' has been blocked by CORS policy: Response to preflight request doesn't pass    arms.html:1
access control check: No 'Access-Control-Allow-Origin' header is present on the requested resource. If an opaque response serves your needs, set the request's mode to 'no-cors'
to fetch the resource with CORS disabled.
GET http://xxx.xxx.xxx.155:9000/api net::ERR_FAILED

若请求失败，您可以参考以下配置处理，以在Node.js应用中配置为例：

//用于设置允许跨域访问该服务.
app.all('*', function (req, res, next) {
  res.header('Access-Control-Allow-Origin', '*');
  res.header('Access-Control-Allow-Headers', 'Content-Type,uber-trace-id'); // linkType: 'tracing' 时，header值需要允许 uber-trace-id；linkType: 'arms'时，header值需要支持：EagleEye-TraceID、EagleEye-SessionID、EagleEye-pAppName
  res.header('Access-Control-Allow-Methods', '*');
  next();
});

enableLinkTrace:true ：开启后
- 如果API请求与页面域名同源时，则默认会在header中增加traceId的透传，实现前后端链路追踪。
- 如果API请求与页面域名非同源时，要实现前后端链路追踪，则需要同时配置enableApiCors:true，并且需要后端服务支持请求跨域及自定义header值。
  
  重要
  请确认所有请求都配合联调正常，否则会出现请求失败的问题。若请求失败，请参见上述在Node.js应用中配置的举例来处理。
linkType: 'tracing' ：
- arms（默认）：使用ARMS私有协议，会传EagleEye开头的几个header。
- tracing：使用Jaeger协议，会传uber-trace-id这个header。