web-monitor-qs v0.0.5

前端监控项目

引入方式一

<script src="xxx/monitor.min.js"></script>

引入方式二

import initMonitor from 'web-monitor-qs';

使用方式

// 定义获取动态数据方法
let getDynamic = () => {
    return {
        userId: 'dynamicId',
        userName: 'userName',
    }
}

// 参数
let options = {
    // 必填 上报地址
    reportUrl:'xxx/api/monitor/acData/save', 
    appId: "",

    storeVisitor: "acVisitor", // 包含 访客ID标识, 以及设备信息，后续可能 IP 地址信息
    openDeviceInfo: true, // 是否开启采集设备信息
    openAddrInfo: false, // 是否开启采集城市信息

    storePage: "acPage", // 页面采集标记
    openPage: true, // 是否开启采集页面
    storeHashChange: "acHashChange", //  url 变化

    openClick: true, //是否开启点击数据采集
    storeClick: "acClick", //点击事件采集标记
    classTag: "isac-", //主动埋点标识, 自动埋点时请配置空字符串

    openAjaxError: true, //自动检测是否开启xhr异常采集
    openAjaxData: true, // 是否采集接口参数
    storeAjaxError: "acAjaxError", //请求异常采集标记

    openJsError: true, //是否开启代码异常采集
    storeJsError: "acJsError", //代码异常采集标记

    openResource: true, // 是否开启 资源加载异常采集
    storeResource: "acResourceError", //资源加载采集标记

    openPromise: true, //是否开启监听全局 Promise 错误
    storePromise: "acPromiseError", // promise 被拒绝

    openVueError: true, //是否开启vue
    storeVueError: "acVueError", // vue error 被拒绝
    vue: null,

    openNetworkSpeed: true, // 是否开启网络测试
    storeNetworkSpeed: "acNetworkSpeed", // speed
    NetworkSpeedFilePath: "https://file.40017.cn/tcservice/common/imags/network_speed.png",
    NetworkSpeedTimeInterval: 60 * 1000,

    openPagePerformance: true, //是否开启页面性能采集
    storePerformance: "acPerformance", // Performance
    openResourceType: ["script", "css", "fetch", "xmlhttprequest", "link", "img"], // 收集资源类型

    // 扩展数据
    extendsInfo: {
        userId: "",
        name: "",
        getDynamic,
    }
}
 let handleReport =  initMonitor(options)

// 主动上报
handleReport()