Application Real-Time Monitoring Service：在Weex環境接入前端監控

匯入npm包

如需在Weex環境中使用ARMS前端監控，則首先需要在專案中執行以下命令匯入alife-logger npm包，以使用專門的WeexLogger模組來上報日誌。

npm install alife-logger --save

初始化

在/utils目錄下建立monitor.js檔案，並按照以下範例程式碼完成SDK初始化。

// 在monitor.js檔案中增加以下內容。
import WeexLogger from 'alife-logger/weex';

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。
const wxLogger = WeexLogger.singleton({
    pid: 'your-project-id',
    uid: 'zhangsan',
    // 設定uid，用於產生UV報告。
    page: 'Lazada | Home',
    // 設定初始頁面名稱。SDK將在初始化完成後發送PV日誌。
    imgUrl: 'https://arms-retcode.aliyuncs.com/r.png?',
    // 設定日誌上傳地址。如需部署至新加坡地區，則改為'https://arms-retcode-sg.aliyuncs.com/r.png?'。
    // 設定GET上報方法，樣本如下：
    sendRequest: (data, imgUrl) = >{
        const url = imgUrl + serialize(data);
        fetch({
            method: 'GET',
            url
        });
    },
    // 設定POST上報方法，樣本如下：
    postRequest: (data, imgUrl) = >{
        fetch({
            method: 'POST',
            type: 'json',
            url: imgUrl,
            body: JSON.stringify(data)
        });
    }
});

export
default wxLogger;

上報

通過執行個體調用相應的上報方法進行上報。

// in some biz module
import wxLogger from '/utils/monitor';
wxLogger.api('/search.do', true, 233, 'SUCCESS');

通用API：@static singleton()

@static singleton()為靜態方法，作用是返回一個單例對象。props只在第一次調用時生效，用法如下表所示。

此方法可用於在應用入口初始化SDK，請參見初始化。

通用API：setPage()

setPage()的作用是設定當前頁面的Page Name，並且預設上報一次PV日誌。

import wxLogger from '/utils/monitor';
// ...
wxLogger.setPage(nextPage);

通用API：setConfig()

setConfig()的作用是在SDK初始化完成後修改部分配置項，具體配置與singleton()方法相同。配置項詳情，請參見setConfig()。

import wxLogger from '/utils/monitor';
// ...
wxLogger.setConfig(config);

日誌上報API

請參見前端介面說明中的日誌上報介面。

通用SDK配置項

ARMS前端監控提供一系列SDK配置項，讓您能夠通過設定參數來滿足額外需求。以下是適用於本文情境的通用配置項。

ARMS前端監控還提供了更多SDK配置項，可滿足進一步的需求。更多資訊，請參見SDK參考。