本文介绍如何使用 ARMS 前端监控开始监控钉钉小程序,以及相关的通用配置、API 方法和进阶场景。

操作步骤

操作步骤包括引入 npm 包并初始化、上报和设置安全域名。

  1. 引入 npm 包并初始化。

    1. 在钉钉小程序的项目中引入 alife-logger npm 包,以便使用该模块来上报日志。

      npm install alife-logger                      
    2. 将以下内容添加至 /utils 目录下的 monitor.js 文件中以完成初始化。

      说明 您可以自定义 JS 文件的名称和存放位置。
      import EAppLogger from 'alife-logger/eapp';
      const Monitor = EAppLogger.init({
          pid: 'xxx',
          region: "cn", // 指定应用部署的地域:中国设为cn,海外地区靠近新加坡的设为sg,靠近美国的设为us。
      });
      
      export default Monitor;            
      说明 关于参数的详细配置,请参考通用参数
  2. 使用以下方法静默采集 PV、Error、API、性能及 Health 数据。

    1. 在 app.js 中,使用 Monitor.hookApp(options) 方法静默捕获 Error 类日志。其中的 options 即为 App 层相应的 Object 配置。

      import Monitor from '/util/monitor';
      
      App(Monitor.hookApp({
        onError(err) {
            console.log('进入onError:', err);
        },
        onLaunch() {
          console.log('进入onLaunch');
        },
      
        onShow(options) {
        },
        onHide() {
        }
      }));                         
    2. 在 page 的 JS 文件中通过 Monitor.hookPage(options) 方法静默上报 API 请求、PV、Health 数据。

      import Monitor from '/util/monitor';
      // 使用hookPage后,生命周期的API会自动打点。
      Page(Monitor.hookPage({
         data: {},
          onLoad(query) {
          },
          onReady() {
          // 页面加载完成
          },
          onShow() {
      
          },
          onLoad(query) {
      
          },
          onHide() {
      
          },
          onUnload() {
      
          }     
      }));                        
  3. 设置安全域名。

    • 如果 region 设为 cn,则将 arms-retcode.aliyuncs.com 添加到 HTTP 安全域名。
    • 如果 region 设为 sg,则将 arms-retcode-sg.aliyuncs.com 添加到 HTTP 安全域名。

通用参数

通用的初始化参数如下表所示。

参数 类型 描述 是否必需 默认值
pid String 站点 ID。 null
uid String 用户 ID,用于统计 UV。 Storage 设置
tag String 传入的标记。每条日志都会携带该标记。
disabled Boolean 是否禁用日志上报功能。 false
sample Integer 日志采样率,值为 1、10 或 100。性能和成功 API 日志按照 1/sample 的比例上报。 1
enableLinkTrace Boolean 是否支持前后端链路追踪。 false
disableHook Boolean 是否禁用 dd.httpRequest 请求监听。默认会监听并用于上报 API 调用成功率。 false
sendRequest Function 发送日志的方法。如果不配置,则采用默认值 dd.httpRequest。 dd.httpRequest
getCurrentPage Function 获取当前页面的方法。 getCurrentPage

API 方法:静默打点基础 API

方法 参数 备注 示例使用场景
hookApp {} 请传入原有的 App 参数。 在 App 的生命周期中自动打点。
hookPage {} 请传入原有的 Page 参数。 在 Page 的生命周期中自动打点。
说明 小程序监控项目如需使用 hookApp、hookPage 嵌入生命周期打点,必须符合标准小程序关于 App 和 Page 的规范,即 App 层有 onError,Page 层有 onShowonHideonUnload。使用方法示例请参考操作步骤

API 方法:其他设置 API

方法 参数 备注
setCommonInfo {[key: string]: string;} 设置日志基础字段,可用于灰度发布等场景。
setConfig {[key: string]: string;} 设置 config 字段。
pageShow {} Page Show 打点,发送 PV 数据。
pageHide {} Page Hide 打点,发送 Health 数据。
error String/Object 错误日志打点。
api String API 类日志上报。
sum/avg String 自定义求和、求均值日志上报。

高级使用方法

当基础使用方法无法满足需求时,请参考以下进阶场景。

  • 手动上报 API 相关信息(不采用静默上报方式)

    1. disableHook 设为 true,不静默上报 dd.httpRequest 请求的日志。
    2. 手动调用 api() 方法上报 API 相关信息。
  • 取消静默上报并改为手动打点

    1. 在 App 和 Page 对应的 JS 文件中不再使用 hookApphookPage 方法。

    2. 如需发送当前页面的 PV 数据,则在 Page 的 onShow 方法下调用 pageShow() 方法。

      说明 请勿与 hookPage() 方法同时使用此方法,否则会造成 PV 类日志重复上报。
      import Monitor from '/util/monitor';
      Page({
          onShow: function() {
              Monitor.pageShow();
          }
      })                         
    3. 如需发送当前页面的 Health 类数据,统计当前页面的健康度和页面停留时间,则在 Page 的 onHideonUnload 方法下调用 pageHide() 方法。

      说明 请勿与 hookPage() 方法同时使用此方法,否则会造成日志重复上报。
      import Monitor from '/util/monitor';
        Page({
      
            onHide: function() {
                Monitor.pageHide();
            },
            onUnload: function() {
                Monitor.pageHide();
            }
            ... 
        })                    

更多信息