Application Real-Time Monitoring Service:Métodos do SDK

Métodos neste tópico

• APIs de relatório de dados: api() | error() | sum() | avg() | reportBehavior() | performance()

• APIs de métodos: setConfig() | setPage() | setCommonInfo() | addBehavior()

api()

Use api() para relatar a taxa de sucesso de chamadas de API em uma página.

Por padrão, o SDK monitora requisições AJAX na página e chama esta API para relatar dados. Se sua página solicitar dados via JSONP ou outros métodos personalizados, como um SDK cliente, chame o método api() para relatar os dados manualmente.

Sintaxe de api():

__bl.api(api, success, time, code, msg, begin, traceId, sid)

Ou

__bl.api({api: xxx, success: xxx, time: xxx, code: xx, msg: xx, begin: xx, traceId: xx, sid: xx})

Exemplo de api():

var begin = Date.now(),
    url = '/data/getTodoList.json',
    traceId = window.__bl && __bl.getTraceId('EagleEye-TraceID'),
    sid = window.__bl && __bl.getSessionId('EagleEye-SessionID');
// Note: Include EagleEye-TraceID and EagleEye-SessionID in the request header.
fetch(url, {
    headers: {
        'EagleEye-TraceID': traceId,
        'EagleEye-SessionID': sid
    }
}).then(function (result) {
    var time = Date.now() - begin;
    // Report a successful API call.
    window.__bl && __bl.api(url, true, time, result.code, result.msg, begin, traceId, sid);
    // do something...
}).catch(function (error) {
    var time = Date.now() - begin;
    // Report a failed API call.
    window.__bl && __bl.api(url, false, time, 'ERROR', error.message, begin, traceId, sid);
    // do something...
});

[[Voltar ao topo]](#sc_index)

error()

Chame o método error() para relatar erros ou exceções de JS nas páginas monitoradas. É possível visualizar os detalhes na página JS Error Diagnostics do Browser Monitoring.

Geralmente, o SDK escuta erros globais na página e chama este método para relatar exceções. No entanto, detalhes do erro costumam ser inacessíveis devido à política de mesma origem do navegador. Nesse caso, relate tais erros manualmente.

Sintaxe de error():

__bl.error(error, pos)

Exemplo 1 de error(): Escutar e relatar erros JS na página.

window.addEventListener('error', function (ex) {
    // The event argument usually contains location information.
    window.__bl && __bl.error(ex.error, ex);
});

Exemplo 2 de error(): Relatar uma mensagem de erro personalizada.

window.__bl && __bl.error(new Error('A custom error occurred'), {
    filename: 'app.js', 
    lineno: 10, 
    colno: 15
});

Exemplo 3 de error(): Relatar uma mensagem de erro de tipo personalizado.

__bl.error({name:'CustomErrorLog',message:'this is an error'}, {
    filename: 'app.js', 
    lineno: 10, 
    colno: 15
});

[[Voltar ao topo]](#sc_index)

sum()

Use o método sum() para relatar estatísticas personalizadas. Este método serve tipicamente para contar ocorrências de um evento de negócio. Visualize os dados relatados pelo método sum() na página Custom Statistics:

• Gráfico de tendências de eventos personalizados

• Visualizações de página (PVs) e visitantes únicos (UVs) de um evento

• Informações de distribuição dimensional

Sintaxe de sum():

__bl.sum(key, value)

Exemplo de sum():

__bl.sum('event-a');
__bl.sum('event-b', 3);

[[Voltar ao topo]](#sc_index)

avg()

Use o método avg() para relatar dados personalizados. Este método serve geralmente para calcular a média de ocorrências ou o valor de um evento de negócio específico. Consulte os dados relatados por avg() na página Custom Statistics:

• Gráfico de tendências de eventos personalizados

• PVs e UVs de um evento

• Informações de distribuição dimensional

Sintaxe de avg():

__bl.avg(key, value)

Exemplo de avg():

__bl.avg('event-a', 1);
__bl.avg('event-b', 3);

[[Voltar ao topo]](#sc_index)

reportBehavior()

Chame reportBehavior() para relatar imediatamente a fila de comportamentos atual.

Se você não chamar este método manualmente, a fila de comportamentos atual será relatada automaticamente quando ocorrer um erro JS. O tamanho máximo da fila é 100. Se a fila contiver mais de 100 registros, os registros mais antigos serão descartados.

Sintaxe de reportBehavior():

__bl.reportBehavior()

O método reportBehavior() não aceita parâmetros.

[[Voltar ao topo]](#sc_index)

addBehavior()

Chame o método addBehavior() para adicionar um comportamento personalizado do usuário à fila de comportamentos atual.

O SDK mantém uma fila de comportamentos do usuário com comprimento máximo de 100 entradas. Use o método addBehavior() para anexar um comportamento personalizado à fila. Quando ocorre um erro JS, o SDK relata a fila de comportamentos atual e a limpa.

Visualize o rastreamento de comportamento do usuário na página JS Error Diagnostics. Para instruções, consulte Use user behavior traceback to diagnose JS errors.

Sintaxe de addBehavior():

__bl.addBehavior(behavior)

Exemplo de addBehavior():

__bl.addBehavior({
  data:{name:'string',message:'string'},
  page:'string'
})

[[Voltar ao topo]](#sc_index)

performance()

Chame o método performance() após o evento onLoad da página para relatar métricas de desempenho personalizadas, além das métricas padrão.

Para usar o método performance(), execute as etapas a seguir:

1. Defina o parâmetro autoSendPerf como false para desativar o relatório automático de métricas de desempenho e aguardar o relatório manual.

2. Chame o método __bl.performance(Object) para relatar manualmente as métricas personalizadas. Esta chamada envia tanto suas métricas personalizadas quanto as métricas de desempenho padrão coletadas pelo SDK.

Exemplo 1 de performance(): com CDN.

window.onload = () => {
 setTimeout(()=>{
  __bl.performance({cfpt:100, ctti:200, t1:300, …});
 }, 1000); // Delay to ensure all default performance metrics are collected before manual reporting.
};

Exemplo 2 de performance(): com pacote npm.

const BrowserLogger = require('@arms/js-sdk');
const __bl = BrowserLogger.singleton({pid:'Your unique site ID'});
window.onload = () => {
 setTimeout(()=>{
  __bl.performance({cfpt:100, ctti:200, t1:300, …});
 }, 1000);// Delay to ensure all default performance metrics are collected before manual reporting.
};

• cfpt: tempo personalizado de primeira pintura

• ctti: primeiro tempo personalizado para interação

• t1 a t10: 10 métricas de desempenho personalizadas

[[Voltar ao topo]](#sc_index)

setConfig()

Chame setConfig() após a inicialização do SDK para modificar itens de configuração específicos. Para mais informações, consulte SDK reference.

Sintaxe de setConfig():

__bl.setConfig(next)

[[Voltar ao topo]](#sc_index)

setPage()

Use setPage() para redefinir o nome da página, o que aciona por padrão um novo relatório de PV. Este método é tipicamente usado para aplicativos de página única (SPA). Para mais informações, consulte Page data reporting of SPAs.

Sintaxe de setPage():

__bl.setPage(page, sendPv)

Exemplo de setPage():

// Set the page name to the current URL hash and report a new PV.
__bl.setPage(location.hash);

// Set the page name to 'homepage' without reporting a new PV.
__bl.setPage('homepage', false);

[[Voltar ao topo]](#sc_index)

setCommonInfo()

Use setCommonInfo() para definir campos comuns.

Sintaxe de setCommonInfo():

__bl.setCommonInfo(obj)

O método setCommonInfo() aceita um parâmetro de objeto:

__bl.setCommonInfo({
  name: 'xxx',
  common: 'xxx'
});

[[Voltar ao topo]](#sc_index)

Criar várias instâncias

Para criar várias instâncias, use o pacote npm @arms/js-sdk.

Páginas Web

• Exemplo:

  const BrowerLogger = require('@arms/js-sdk');
  const bl2 = BrowerLogger.createExtraInstance(props); // Create an instance using the createExtraInstance method.
  bl2.custom({
    key: 'biz',
    msg: 'msg info'
  });

  Nota

  O parâmetro props é do tipo Object. Os parâmetros contidos em props são basicamente os mesmos das configurações do SDK.

• As novas instâncias relatam apenas informações personalizadas:

  var props = {
    pid: 'xxxx', // The site ID where the new instance reports data.
    region: 'cn',
    page: '',
    uid: ''
  }

Páginas Weex

• Exemplo:

  const WeexLogger = require('@arms/js-sdk/weex');
  const wl2 = WeexLogger.createExtraInstance(props); // Create an instance using the createExtraInstance method.
  wl2.custom({
    key: 'biz',
    msg: 'msg info'
  });

  Nota

  O parâmetro props é do tipo Object. Os parâmetros contidos em props são basicamente os mesmos das configurações do SDK.

• As novas instâncias relatam apenas informações personalizadas:

  var props = {
    pid: 'xxxx', // The site ID where the new instance reports data.
    region: 'cn',
    sendRequest: function(data, imgUrl) {
      // The method for sending logs using GET requests.
    },
    postRequest: function(data, imgUrl) {
      // The method for sending logs using POST requests.
    }
  }

Mini programas

import MiniProgramLogger from '@arms/js-sdk/miniapp'; // Select the path that matches your mini program type, such as a DingTalk mini program or an Alipay mini program.
const MiniInstance = MiniProgramLogger.createExtraInstance({
  pid: 'xxxinstance',
  uid: 'userxxx', // User ID for collecting UV data.
  region: 'cn', // The region where logs are reported. Set the value to `cn` for China or `sg` for Singapore. Defaults to `cn` if unspecified.
  // For basic mini program monitoring, you must manually pass the remote procedure call (RPC) method. Implement the method based on your business requirements.
  sendRequest: (url, resData) => {
    // The method for sending data.
  }
});