Package Exports

wind-logger
wind-logger/dist/index.js

This package does not declare an exports field, so the exports above have been automatically detected and optimized by JSPM instead. If any package subpath is missing, it is recommended to post an issue to the original package (wind-logger) to support the "exports" field. If that is not possible, create a JSPM override to customize the exports field for this package.

Readme

风行前端行为日志采集模块

安装项目依赖

npm install wind-logger

引入日志模块

import { App } from 'vue'
import FxLogger from 'wind-logger'
const LOGGER_CONFIG = {
    // 日志索引
    app: 'logger-test',
    // 日志服务地址
    remote: 'http://action.fxscm.net/logger/v1/shopedi/loggers'
    // 生产线的默认字段
    defaultInfo: {
        appType: 'scm8'
    },
    // 生产线的自定义字段
    customInfo: {
        actionType: ''
    }
}
// 创建日志实例
const fxLogger = new FxLogger(LOGGER_CONFIG)
const install = (app: App): void => {
    // 捕获vue-error日志
    fxLogger.bindErrorLogger(app)
    // 挂载日志模块
    app.config.globalProperties.$fxLogger = fxLogger
}

export default {
    install
}

挂载日志模块

// /src/main.ts

import { createApp } from 'vue'
import App from './App.vue'
import appInit from './js/appInit'

createApp(App).use(appInit).mount('#app')

vue-instance声明日志模块, 在setup内可以通过vue-instance调用$fxLogger

import { getCurrentInstance, ComponentInternalInstance } from 'vue'
import FxLogger from '@/js/fxLogger'

export interface FxInstance {
    $fxLogger: FxLogger
}

export const getFxInstance = function ():FxInstance {
    const { appContext } = getCurrentInstance() as ComponentInternalInstance
    return appContext.config.globalProperties as FxInstance
}

使用方法

// 日志初始化
fxInstance.$fxLogger.init({
    username: '系统管理员',
    userId: '1'
})

日志初始化

// 切换用户
fxInstance.$fxLogger.setUserInfo({
    username: '用户01',
    userId: '2'
})

切换用户

// 发送成功日志
const logger = this.$fxLogger.actionInfo({
    message: '成功的日志消息1',
    // 公司定义的默认日志字段
    oneStageModule: '一级菜单1',
    twoStageModule: '二级菜单1',
     // 生产线定义的自定义日志字段
    actionType: 'demo按钮2'
})
setTimeout(() => {
    logger.success()
}, 1000)

发送成功日志

// 发送失败的日志
const logger = fxInstance.$fxLogger.actionInfo({
    message: '失败的日志消息'
})
setTimeout(() => {
    logger.error('服务器异常')
}, 1000)

发送失败的日志

// 对request请求进行捕获
const fxRequest = ({ url, data, query }: { url: string, data: {[key:string]:string}, query: {[key:string]:string} }) => {
    return new Promise((resolve, reject) => {
        // 创建request日志
        const logger = fxInstance.$fxLogger.requestInfoStart({ url, data, query })
        setTimeout(() => {
            if (data.billType === '1') {
                const succesResponse = {
                    result: true
                }
                // 成功日志的手收集
                logger.end({
                    res: succesResponse
                })
                resolve(succesResponse)
            } else {
                const errorResponse = {
                    result: false,
                    message: '单据类型错误'
                }
                // 失败日志的收集
                logger.end({
                    error: errorResponse
                })
                reject(errorResponse)
            }
        }, 1000)
    })
}

request请求日志