Narcoleptic Programmers' Medicine

    logjs.npm

    1.0.2 • Public • Published

    log.js v1.0 版本发布啦,在大家的帮助下,第一个版本终于面世了,欢迎大家提出建议或者意见,我都会尽快给出回复。当然大家能够 star 一下那是坠吼了 哈哈

    开源地址戳这里 这是开源地址欢迎大家来提交 issues,我会在第一时间进行回复

    进入正题,什么是 log.js

    log.js 是一个前端监控插件,您只需要一行代码就可以对您的 web应用 进行 性能 错误 终端信息 等 监控

    一个简单的使用栗子

    <head>
        <meta charset="UTF-8">
        <title>示例</title>
        <script src="./log.min.js"></script>
    </head>
    
    <body>
    	<script>
    		log.init();
    	</script>
    </body>
    //React / Vue 工程下
    npm i logjs.npm
    
    import log from 'logjs.npm';
    
    log.init();

    作为一个 web开发者,我深知阅读 api文档 的痛苦,所以我选择将 log.js 设计成 开箱即用 的模式,仅需要调用 log.init 即可启动他

    日志信息将去往哪里

    log.js 本身并不会私自进行上报,仅在您配置了上报相关的配置后,他会以 web应用 无感知的方式进行日志的上报,同时,他也提供了日志本地存储的能力.

    日志将怎么存储

    日志默认采用 5秒 捕获一次的方式进行 存储与上报,在一个频次下 会捕获 上一个 5秒 之内的 日志.

    image.png

    API

    log.init

    log.init();//默认模式启动
    
    log.init({
    	id: 'log-id',//为终端携带特殊标识,会携带在上报报文中
    	path: 'https://test.do',//上报地址,默认 POST JSON 形式进行上报
    	logType: ['click', 'error', 'request'],//捕捉日志类型,默认捕捉所有类型日志
    	requestingBefore: (params, terminalInfo) => do something; //调用请求接口前,为接口调用设置统一参数, params - 接口参数,terminalInfo - 终端信息,默认使用 params 作为参数
    	reportingBefore: (params) => do something; //报文上报前,为上报报文调整数据结构 默认使用 params
    })

    log.durationLog

    log.durationLog((terminalInfo)=>{
    	do something;
    }, 5000)
    
    //为某一时刻创建时间监听,每隔 第二个参数(单位 毫秒)调用 第一个参数

    更新日志

    V1.1.0 - 功能规划

    • [ ] 存储模式支持 indexDB
    • [ ] 上报时机调整为 空闲模式上报 ,减少对业务系统的性能影响

    V1.0.0 - 功能(已实现)

    • 捕获能力: JS执行错误 fetch/xhr 接口调用 页面点击 fetch/xhr 接口调用异常 终端信息
    • 日志存储方式: localStroage sessionStorage 接口上报

    Install

    npm i logjs.npm

    DownloadsWeekly Downloads

    0

    Version

    1.0.2

    License

    ISC

    Unpacked Size

    34.9 kB

    Total Files

    8

    Last publish

    Collaborators

    • fanliang