Application Real-Time Monitoring Service:Monitor WeChat mini programs

Background information

For more information about WeChat mini programs, visit WeChat mini programs.

Basic method

To monitor a WeChat mini program, you must perform the following steps:

1. Obtain and initialize the monitoring SDK for WeChat mini programs.

   1. Create a wxLogger.js file in the /utils folder of the WeChat mini program that you want to monitor and copy the content of the JS file to the wxLogger.js file.
   2. Create a monitor.js file in the /utils folder and add the following content to the monitor.js file to initialize the monitoring SDK.
      Note You can customize the name and storage path of the JS file.

      • If the project is integrated by using the node module (require) method, add the following content to the monitor.js file:

        const WXLogger = require('./wxLogger.js');
            const Monitor = WXLogger.init({
                pid: 'xxx',
                region: 'cn',    // Specify the region where the application is deployed. A value of cn indicates China, and a value of sg indicates regions that are close to Singapore. 
            });
            export default Monitor;

      • If the project is integrated by using the ES module (import) method, add the following content to the monitor.js file:

        import WXLogger from './wxLogger.js';
            const Monitor = WXLogger.init({
                pid: 'xxx',
                region: 'cn',    // Specify the region where the application is deployed. A value of cn indicates China, and a value of sg indicates regions that are close to Singapore. 
            });
            export default Monitor;

      Note For more information about parameter settings, see Common SDK parameters.

2. Use the following methods to automatically collect the PV, error, API, performance, and health data of the WeChat mini program:

   1. In app.js, call the Monitor.hookApp(options) method to automatically capture error logs. The options parameter is an 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() {
        }
      }));

   2. In page.js, call the Monitor.hookPage(options) method to automatically report the API, PV, and health data of the WeChat mini program.

      import Monitor from '/util/monitor';
      // After you call the hookPage method, the lifecycle-based API automatically starts instrumentation. 
      Page(Monitor.hookPage({
         data: {},
          onLoad(query) {
          },
          onReady() {
          // The page is loaded. 
          },
          onShow() {
      
          },
          onLoad(query) {
      
          },
          onHide() {
      
          },
          onUnload() {
      
          }     
      }));

3. Set security domain names.

   • If the region parameter is set to cn, add https://arms-retcode.aliyuncs.com to the valid domain names of the request.

   • If the region parameter is set to sg, add https://arms-retcode-sg.aliyuncs.com to the valid domain names of the request.

Basic methods for automatic instrumentation

Methods for other settings

Advanced scenarios

If the basic usage of application monitoring cannot meet your requirements, try the usage in the following advanced scenarios:

• Manually report the API request results.

  1. Set the disableHook parameter to true. The logs of the wx.request request are not automatically reported.

  2. Manually call the api() method to report the API request results.

• Disable automatic reporting and enable manual tracking.

  1. Do not use the hookApp and hookPage methods in the app.js and page.js files.

  2. To send the PV data of the current page, call the pageShow() method in the onShow method of Page.

     Note We recommend that you do not call the pageShow() method together with the hookPage() method. Otherwise, the PV logs are repeatedly reported.

     import Monitor from '/util/monitor';
     Page({
         onShow: function() {
             Monitor.pageShow();
         }
     })

  3. To send the health data including the health and browsing time of the current page, call the pageHide() method under the onHide and onUnload methods of Page.

     Note Do not call the pageHide() method together with the hookPage() method. Otherwise, the logs are repeatedly reported.

     import Monitor from '/util/monitor';
       Page({
     
           onHide: function() {
               Monitor.pageHide();
           },
           onUnload: function() {
               Monitor.pageHide();
           }
           ... 
       })

Common SDK parameters

The browser monitoring feature of ARMS allows you to set a variety of SDK parameters to meet additional requirements. The following table describes the common parameters suitable for the scenarios described in this topic.

The ARMS browser monitoring feature also provides other SDK parameters to meet your business requirements. For more information, see SDK reference.