This topic describes how to use the browser monitoring function of Application Real-Time Monitoring Service (ARMS) to monitor Alipay mini programs. It also demonstrates the general configurations, methods, and advanced scenarios.
Basic usage
To monitor the mini programs, you must perform at least the three steps: introducing and initializing the npm (Node Package Manager) package, reporting logs, and setting security domains.
-
Introduce and initialize the npm package.
-
Introduce the npm package named
alife-logger
in the Alipay mini program project to facilitate log reporting.npm install alife-logger
-
Add the following information to the monitor.js file in the /utils directory to initialize the npm package.
Note You can specify the name and storage path of the JS file.import AlipayLogger from 'alife-logger/alipay'; const Monitor = AlipayLogger.init({ pid: 'xxx', region: "cn", // The region where the application is deployed. Set it to cn if the application is deployed in China and to sg if the application is deployed outside China. }); export default Monitor;
Note For more information about parameter configurations, see Common parameters.
-
-
Call the following methods to automatically collect the page view (PV), error, API request, performance, and health data.
-
In app.js, call Monitor.hookApp(options) to automatically capture error logs. The options parameter is the app-specific object.
import Monitor from '/util/monitor'; App(Monitor.hookApp({ onError(err) { console.log('Trigger onError:', err); }, onLaunch() { console.log('Trigger onLaunch'); }, onShow(options) { }, onHide() { } }));
-
In page.js, call Monitor.hookPage(options) to automatically report the API request, PV, and health data.
import Monitor from '/util/monitor'; // After hookPage is called, the lifecycle API automatically starts instrumentation. Page(Monitor.hookPage({ data: {}, onLoad(query) { }, onReady() { // Page loaded. }, onShow() { }, onLoad(query) { }, onHide() { }, onUnload() { } }));
-
-
Set security domains.
-
If the region is set to
cn
, add arms-retcode.aliyuncs.com to the HTTP security domain of the request. -
If the region is set to
sg
, add arms-retcode-sg.aliyuncs.com to the HTTP security domain of the request.
-
Common parameters
The following table lists the common parameters that are used for initializing the npm package.
Parameter | Type | Description | Required | Default value |
---|---|---|---|---|
pid | String | The ID of the site. | Yes | null |
uid | String | The ID of the user, which is used to collect the unique visitor (UV) data. | No | Storage setting |
tag | String | The input tag. Each log carries a tag. | No | None |
disabled | Boolean | Specifies whether the log reporting function is disabled. | No | false |
sample | Integer | The log sampling rate. Valid values: 1, 10, and 100. Performance logs and successful API request logs are reported in a 1/number of samples ratio. | No | 1 |
enableLinkTrace | Boolean | Specifies whether front-to-back tracing is supported. | No | false |
disableHook | Boolean | Specifies whether to disable monitoring my.httpRequest. By default, the request is monitored, and the API request success rate is reported. | No | false |
sendRequest | Function | The method for sending logs. If this parameter is not configured, the default value my.httpRequest is used. | No | my.httpRequest |
getCurrentPage | Function | The method for obtaining the current page. | No | getCurrentPage |
Basic methods for automatic instrumentation
Method | Parameter | Remarks | Scenario |
---|---|---|---|
hookApp | {} | Enter the source app parameters. | The app lifecycle API automatically starts instrumentation. |
hookPage | {} | Enter the source page parameters. | The page lifecycle API automatically starts instrumentation. |
Methods for other settings
Method | Parameter | Remarks |
---|---|---|
setCommonInfo | {[key: string]: string;} | Set basic log fields for the scenarios such as phased release. |
setConfig | {[key: string]: string;} | Set the config field. |
pageShow | {} | Report the PV data. |
pageHide | {} | Report the health data. |
error | String/Object | Report error logs. |
api | See also API reference | Report the API request logs. |
sum/avg | String | Report the custom sum and average logs. |
Advanced scenarios
When the basic usage cannot meet your needs, see the following advanced scenarios.
-
Manually report the API request results (automatic reporting is disabled).
-
Set disableHook to
true
. The logs of the my.httpRequest request are not reported automatically. -
Manually call api() to report the API request results.
-
-
Disable automatic reporting and enable manual instrumentation.
-
No longer use the hookApp and hookPage methods in the app.js and page.js files.
-
To send the PV data of the current page, call pageShow() under onShow of Page.
Note Do not call pageShow() together with hookPage(). Otherwise, the PV logs are reported repeatedly.import Monitor from '/util/monitor'; Page({ onShow: function() { Monitor.pageShow(); } })
-
To send the health data (health and browsing time) of the current page, call pageHide() under onHide and onUnload of Page.
Note Do not call pageHide() together with hookPage(). Otherwise, the logs are reported repeatedly.import Monitor from '/util/monitor'; Page({ onHide: function() { Monitor.pageHide(); }, onUnload: function() { Monitor.pageHide(); } ... })
-