8.1 埋点 - HelloHxz/react-bricks GitHub Wiki

snk-log

支持全局禁止输出日志，增强日志输出格式，支持日志埋点统一处理

Demo 实例

npm install

npm start

http://localhost:4000/index.html

可以在DEMO项目 目录下可以查看上传记录 errorlog.txt 和 eventtrack.txt

使用方法

webpack集成

npm install snk-log --save

普通链接引用

下载index.js

<script src="./具体路径/index.js"></script>

调用

   var logInstance = new SnkLog({
    eventTrackServerPath:"./eventsupload",
    eventUploadCount:5,
    errorUploadCount:2,
    uploadFreq:1000*60*4, // 四分钟轮训
    errorLogServerPath:"./errorupload",
    onEventTrackAdd:function(params){
        /* 
           logInstance.eventTrackStack 埋点数组 可以对这个数组进行过滤，修改，清空
        */
  
    },
    onErrorLogAdd:function(params){
        /* 
           logInstance.errorLogStack 日志错误 可以对这个数组进行过滤，修改，清空
        */

    }

});

// console.profile();
console.time();
console.log("log","console.log");
console.info("info",'console.info');
console.warn("warn",'console.warn');
console.debug("debug","console.debug");
console.error("error","console.error");
console.trace("trace","console.trace");
console.timeEnd();
// console.profileEnd();


//可以在项目某个地方 增加一个行为埋点  参数可以是任意的类型
console.uploadEvent({
        "method":"111111111",
        "page":"sss",
        "date":new Date().valueOf()
    });
    
    
//可以在项目某个地方 增加一个错误信息  参数可以是任意的类型
console.uploadError({
            msg:"报错13",
            file:"xxx/xx.js",
            column:333,
            row:2333,
            "date":new Date().valueOf()
    });

参数

参数名 类型 说明 是否必传
eventTrackServerPath String 埋点上传地址 否
errorLogServerPath String 错误日志上传地址 否
eventUploadCount Int 埋点行为分析上传缓冲区大小（超出则上传） 否
errorUploadCount Int 错误日志上传缓冲区大小（超出则上传） 否
uploadFreq Int 轮训上传间隔 （例如 1000604 四分钟） 否
onEventTrackAdd Function 产生一条埋点记录回调，可以在这里操作埋点记录缓存数组，进行过滤，修改，清空 否
onErrorLogAdd Function 产生一条错误日志回调，可以在这里操作埋点记录缓存数组，进行过滤，修改，清空 否

日志上传行为收集 API

方法名 说明 参数
console.uploadEvent 行为埋点上传 JSON/String/...
console.uploadError 错误日志收集 JSON/String/...
console.startInterval 启动轮训上传（如果设置了 uploadFreq） 无
console.cancelInterval 取消轮训上传（如果设置了 uploadFreq） 无

console.uploadEvent 和 console.uploadError 的参数可以灵活配置，但是只接收一个参数。这些方法回往各自的缓冲数组push一条记录，然后统一调度将数组上传。

日志输出 API

方法名 说明 参数
console.disableConsole 禁止输出打印日志 无
console.enableConsole 启用输出打印日志 无
console.log 原生log的封装 和原生一致
console.info 原生info的封装 和原生一致
console.debug 原生debug的封装 和原生一致
console.error 原生error的封装 和原生一致
console.clear 原生clear的封装 和原生一致
console.trace 原生trace的封装 和原生一致
console.time 原生time的封装 和原生一致
console.timeEnd 原生timeEnd的封装 和原生一致
console.group 原生group的封装 和原生一致
console.groupEnd 原生groupEnd的封装 和原生一致
console.profile 原生profile的封装 和原生一致
console.profileEnd 原生profileEnd的封装 和原生一致

原理

使用自定义的Console覆盖原生的方法，通过参数配置做到禁用系统console输出

上传接口约定

可参照 server.js 中的Node实现

Footer

⚠️ **GitHub.com Fallback** ⚠️