如何在Vue应用中使用AppDynamics adrum发送并查看自定义日志

实现自定义日志发送（TypeScript） #

AppDynamics的adrum脚本支持主动上报自定义日志，你可以在Vue的TS文件中通过以下方式实现：

方式1：使用内置log方法 #

先处理TypeScript的类型兼容问题，再调用adrum的日志方法：

// 全局类型声明（避免TS报错）
declare global {
  interface Window {
    adrum: {
      log: (msg: string, level?: 'info' | 'warn' | 'error' | 'debug') => void;
    };
  }
}

// 封装日志发送函数
const sendADLog = (message: string, level: 'info' | 'warn' | 'error' | 'debug' = 'info') => {
  window.adrum?.log(message, level);
};

// 调用示例
sendADLog('用户提交了表单', 'info');
sendADLog('接口返回异常', 'error');

方式2：通过自定义事件上报 #

如果你的adrum版本不支持log方法，可通过自定义事件携带日志内容：

const sendCustomADLog = (message: string) => {
  window.adrum?.sendCustomEvent({
    eventName: 'CustomApplicationLog',
    eventProperties: {
      logContent: message,
      logLevel: 'info'
    }
  });
};

在AppDynamics中查看日志 #

• 登录控制台后，进入Browser RUM模块，选择你的目标应用
• 若使用log方法上报：
  • 进入Errors & Logs页面，在日志列表中筛选对应级别的自定义日志
  • 或进入User Sessions，查看具体用户会话的时间线，日志会作为事件展示
• 若使用自定义事件上报：
  • 进入Custom Events页面，通过事件名称（如CustomApplicationLog）筛选，查看携带的logContent字段内容

内容的提问来源于stack exchange，提问作者Carabes