Application Real-Time Monitoring Service:Monitorar outros tipos de mini programas

Uso básico

A configuração básica envolve três etapas: instale e inicialize o pacote npm, reportar logs e configure domínios de segurança.

1. Instale e inicialize o pacote npm.

   1. No projeto do seu mini programa, instale o pacote npm @arms/js-sdk para ative o monitoramento.

      npm install @arms/js-sdk

   2. Adicione o código abaixo a um arquivo monitor.js no diretório /utils para inicializar o SDK.

      Nota

      Você pode personalizar o nome e o local do arquivo JavaScript (JS).

      import MiniProgramLogger from '@arms/js-sdk/miniapp';
      const Monitor = MiniProgramLogger.init({
          pid: 'xxx',
          uid: 'userxxx', // Set the user ID, which is used for UV statistics.
          region: 'cn', // Specify the region where the application is deployed. Set this parameter to 'cn' for the Chinese mainland or 'sg' for regions outside the Chinese mainland. The default value is 'cn'.
          // For basic mini program monitoring, you must manually provide the RPC function. 
          // Implement the function based on your business logic. The following example shows how to make a call in a DingTalk E-App.
          sendRequest: (url, resData) => {
                // You must configure this part. It supports both GET and POST reporting.
              // Demo in DingTalk
              var method = 'GET';
              var data;
              if (resData) {
                  method = 'POST';
                  data = JSON.stringify(resData);
              }
              dd.httpRequest({
                  url: url,
                  method: method,
                  data: data,
                  fail: function (error) {
                      //...
                  }
              });
          },
           // Manually provide a function to get the current page path. 
           // Implement the function based on your business logic. The following example shows how to make a call in a DingTalk E-App.
           getCurrentPage: () => {
                // You must configure this part.
              if (typeof getCurrentPages !== 'undefined' && typeof getCurrentPages === 'function') {
                  var pages = (getCurrentPages() || []);
                  var pageLength = pages.length;
                  var currPage = pages[pageLength - 1];
                  return (currPage && currPage.route) || null;
              }
           }
      });
      
      export default Monitor;

      Nota

      Para obter mais informações sobre os parâmetros, consulte Parâmetros do SDK.

2. Reporte logs.

   1. Em app.js, use um dos métodos a seguir para reportar logs:

      • Use o método Monitor.hookApp(options) para capturar automaticamente logs de erro. O parâmetro options corresponde ao objeto de configuração original do seu App.

        import Monitor from '/utils/monitor';
        
            App(Monitor.hookApp({
              onError(err) {
                console.log('Entering onError:', err);
              },
              onLaunch() {
                console.log('Entering onLaunch');
              },
        
              onShow(options) {
              },
              onHide() {
              }
            }));                

      • Use o método Monitor.error(err) para reportar manualmente logs de erro.

        import Monitor from '/utils/monitor';
        
            App({
              onError(err) {
                  Monitor.error(err);
                console.log('Entering onError:', err);
              },
              onLaunch() {
                console.log('Entering onLaunch');
              },
        
              onShow(options) {
              },
              onHide() {
              }
            });

   2. No arquivo JS de uma página, use um dos seguintes métodos para reportar logs:

      • Use o método Monitor.hookPage(options) para reportar automaticamente dados de visualização de página (PV) e integridade.

        Nota

        Este método não reporta requisições de API automaticamente.

        import Monitor from '/utils/monitor';
        
            Page(Monitor.hookPage({
               data: {},
                onLoad(query) {
                },
                onReady() {
                    // The page has finished loading.
                },
                onShow() {
        
                },
                onLoad(query) {
        
                },
                onHide() {
        
                },
                onUnload() {
        
                },
                onTitleClick() {
                    /**
                     * Report custom instrumentation data.
                     * @desc
                     */
                    Monitor.sum('titleClick');
                }       
            }));

      • Chame métodos de API para reportar dados manualmente.

        Nota

        Para mais detalhes sobre os métodos de API, consulte Métodos de API.

        import Monitor from './util/monitor';
        
            Page({
               data: {},
                onShow() {
                    Monitor.pageShow();
                },
                onHide() {
                    Monitor.pageHide();
                },
                onUnload() {
                    Monitor.pageHide();
                },
                onTitleClick() {
                    /**
                     * Report custom instrumentation data.
                     * @desc
                     */
                    Monitor.sum('titleClick');
                }       
            });

3. Configure os domínios de segurança.

   • Se você defina region como cn, adicione https://arms-retcode.aliyuncs.com à sua lista de domínios válidos.

   • Se você defina region como sg, adicione https://arms-retcode-sg.aliyuncs.com à sua lista de domínios válidos.

Métodos de API

A maioria das APIs de reporte de logs é consistente com o SDK de monitoramento de navegador web. O uso das demais APIs está descrito abaixo:

• Para enviar dados de PV da página atual, chame o método pageShow() dentro do método de ciclo de vida onShow da Page.

  Nota

  Não use este método em conjunto com hookPage(). Caso contrário, logs de PV duplicados serão reportados.

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

• Para enviar dados de integridade da página atual, medindo o nível de saúde e o tempo de permanência, chame o método pageHide() nos métodos de ciclo de vida onHide e onUnload da Page.

  Nota

  Não use este método em conjunto com hookPage(). Caso contrário, logs duplicados serão reportados.

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

Cenários avançados

Se o uso básico não atender às suas necessidades, considere os cenários avançados descritos nesta seção.

• Definição do uid (para estatísticas de UV)

  • Se o ID do usuário estiver disponível antes da inicialização do SDK, defina o uid diretamente na configuração init.

  • Se o ID do usuário não estiver disponível na inicialização, obtenha-o antes do evento onShow da aplicação e, em seguida, defina o uid chamando setCommonInfo({uid: 'xxx'}).

• Configuração de informações comuns para o mini programa

  Use o método setCommonInfo para definir informações comuns do mini programa. O monitoramento de navegador do ARMS analisa os seguintes campos:

  • sr: resolução de tela

  • vp: viewport

  • dpr: taxa de pixels do dispositivo

  • ul: idioma do documento

  • dr: referenciador do documento

  • ct: tipo de conexão de rede (por exemplo, Wi-Fi ou 3G)

    Aviso

    Não defina muitos campos usando o método setCommonInfo. Exceder o limite de tamanho da requisição pode causar falhas.

Parâmetros do SDK

O monitoramento de navegador do ARMS oferece parâmetros de SDK para configurações avançadas. A tabela a seguir descreve parâmetros comuns aplicáveis a este cenário.

Para obter a lista completa de parâmetros do SDK, consulte Configuração do SDK de Monitoramento de Navegador.

Documentação relacionada