Configurar monitoramento de navegador para Weex - Application Real-Time Monitoring Service: Central de Documentação do Alibaba Cloud

Pré-requisitos

Antes de começar, verifique se você possui:

Um site de monitoramento de navegador do ARMS com um ID de site válido (pid)
Node.js e npm instalados no seu ambiente de desenvolvimento
Um projeto Weex que utilize o módulo stream

Etapa 1: Instale o SDK

Execute o comando a seguir na raiz do seu projeto Weex:

npm install @arms/js-sdk --save

Etapa 2: Inicialize o SDK

Crie um arquivo monitor.js no diretório /utils. Esse arquivo funciona como um módulo de monitoramento centralizado, importado pelo restante da aplicação.

O código de inicialização divide-se em duas partes:

Camada de transporte do Weex -- Código padrão que habilita o envio de relatórios via HTTP no Weex. O ARMS exige funções personalizadas sendRequest e postRequest que utilizem o módulo stream do Weex.
Configuração do SDK -- Definições específicas do seu projeto, como o ID do site e o endpoint de relatório.

// /utils/monitor.js
import WeexLogger from '@arms/js-sdk/weex';

// --- Weex transport layer (copy as-is) ---
const fetch = weex.requireModule('stream').fetch;
const serialize = (data) => {
    data = data || {};
    var arr = [];
    for (var k in data) {
        if (Object.prototype.hasOwnProperty.call(data, k) && data[k] !== undefined) {
            arr.push(k + '=' + encodeURIComponent(data[k]).replace(/\(/g, '%28').replace(/\)/g, '%29'));
        }
    }
    return arr.join('&');
};

// --- SDK configuration (replace placeholders with your values) ---
const wxLogger = WeexLogger.singleton({
    pid: '<YOUR_SITE_ID>',
    uid: '<YOUR_USER_ID>',           // User identifier for UV reports
    page: '<YOUR_INITIAL_PAGE>',     // Initial page name; triggers a PV report on init
    imgUrl: 'https://arms-retcode.aliyuncs.com/r.png?',
    // For the Singapore region, use:
    // imgUrl: 'https://arms-retcode-sg.aliyuncs.com/r.png?',

    // GET transport
    sendRequest: (data, imgUrl) => {
        const url = imgUrl + serialize(data);
        fetch({
            method: 'GET',
            url
        });
    },
    // POST transport
    postRequest: (data, imgUrl) => {
        fetch({
            method: 'POST',
            type: 'json',
            url: imgUrl,
            body: JSON.stringify(data)
        });
    }
});

export default wxLogger;

Substitua os seguintes espaços reservados pelos seus valores:

Espaço reservado	Descrição	Exemplo
`<YOUR_SITE_ID>`	ID do site atribuído pelo ARMS durante a criação	`xxxxxxxx`
`<YOUR_USER_ID>`	Identificador de usuário para rastreamento de UV	`user_12345`
`<YOUR_INITIAL_PAGE>`	Nome da primeira página a ser relatada na inicialização	`Home`

Nota

O método WeexLogger.singleton(props) retorna uma instância singleton. O argumento props só tem efeito na primeira chamada. Todas as chamadas subsequentes retornam a mesma instância, independentemente dos argumentos fornecidos.

Etapa 3: Relatar logs

Importe a instância wxLogger em qualquer módulo para relatar dados de monitoramento:

import wxLogger from '/utils/monitor';

// Report an API call
wxLogger.api('/search.do', true, 233, 'SUCCESS');

Para obter a lista completa de métodos de relatório de log, consulte Métodos do SDK.

Referência da API

singleton(props)

Método estático que retorna uma instância singleton de WeexLogger. Utilize-o no ponto de entrada da aplicação para inicializar o SDK. O parâmetro props só tem efeito na primeira chamada.

Parâmetro	Tipo	Obrigatório	Padrão	Descrição
`pid`	String	Sim	Nenhum	ID do site atribuído pelo ARMS
`page`	String	Não	Nenhum	Nome da página inicial. Aciona um relatório de PV após a inicialização
`uid`	String	Sim	Nenhum	ID de usuário para rastreamento de UV
`imgUrl`	String	Não	Nenhum	URL do endpoint de relatório. Deve terminar com `?`

setPage(nextPage)

Defina o nome da página atual e relate um log de PV.

import wxLogger from '/utils/monitor';

wxLogger.setPage(nextPage);

Parâmetro	Tipo	Obrigatório	Padrão	Descrição
`nextPage`	String	Sim	Nenhum	Nome da nova página

setConfig(config)

Atualize a configuração do SDK após a inicialização. Aceita os mesmos parâmetros de singleton(). Para a lista completa de parâmetros, consulte setConfig().

import wxLogger from '/utils/monitor';

wxLogger.setConfig(config);

Parâmetro	Tipo	Obrigatório	Padrão	Descrição
`config`	Object	Sim	Nenhum	Propriedades de configuração a serem atualizadas
`uid`	String	Sim	Configurações de armazenamento	ID de usuário para coleta de dados de UV

Parâmetros do SDK

Os parâmetros a seguir estão disponíveis em WeexLogger.singleton(props) e wxLogger.setConfig(config).

Parâmetro	Tipo	Obrigatório	Padrão	Descrição
`pid`	String	Sim	Nenhum	ID exclusivo do projeto, gerado automaticamente pelo ARMS ao criar um site
`uid`	String	Sim	Nenhum	Identificador de usuário para rastreamento de UV. Se não definido, o SDK gera um valor automaticamente e o renova a cada seis meses
`tag`	String	Não	Nenhum	Tag personalizada anexada a cada entrada de log
`release`	String	Não	`undefined`	Versão da aplicação. Defina este valor para comparar métricas entre diferentes versões
`environment`	String	Não	`prod`	Ambiente de implantação. Valores válidos: `prod` (online), `gray` (lançamento gradual), `pre` (staging), `daily` (build diária), `local` (desenvolvimento local)
`sample`	Integer	Não	`1`	Taxa de amostragem de 1 a 100. Logs de desempenho e logs de API bem-sucedidos são amostrados na proporção de `1/sample`. Para mais detalhes, consulte Métricas estatísticas

Para obter a referência completa de parâmetros, consulte Referência do SDK.