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

背景信息

支付宝小程序

基础使用方法

基础方法包含引入npm包并初始化、上报,和设置安全域名这三个步骤:

  1. 引入npm包并初始化:

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

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

      说明 您可以自定义JS文件的名称和存放位置。
      import AlipayLogger from 'alife-logger/alipay';
      const Monitor = AlipayLogger.init({
          pid: 'xxx',
          region: "cn", // 指定应用部署的地域:中国设为cn,中国以外地域设为sg。
      });
      
      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 是否禁用my.httpRequest请求监听。默认会监听并用于上报API调用成功率。 false
sendRequest Function 发送日志的方法。如果不配置,则采用默认值my.httpRequest。 my.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字段,详情请参见SDK配置项参数
pageShow {} Page Show打点,发送PV数据。
pageHide {} Page Hide打点,发送Health数据。
error String/Object 错误日志打点。
api 参见api() 接口调用成功率上报 API类日志上报。
sum/avg String 自定义求和、求均值日志上报。

进阶场景

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

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

    1. disableHook设为true,不静默上报my.httpRequest请求的日志。

    2. 手动调用api()方法上报API相关信息。

  • 取消静默上报并改为手动打点:

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

    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();
            }
            ... 
        })