vue-worker-logger

This is a plugin to send logs to web front. it's used by web-worker to send logs in Vue.

Install

npm i vue-worker-logger

Usage

First registry the plugin inside your app entrypoint

import loggerWorker from 'vue-worker-logger'

const options = {
  postQueueLen: 20, // one time send logs length (default 20)
  pollTime: 5000, // check log frequency (default 5000 ms)
  axiosSrc: 'https://cdn.bootcdn.net/ajax/libs/axios/0.21.1/axios.min.js' // http library of axios (default https://cdn.bootcdn.net/ajax/libs/axios/0.21.1/axios.min.js)
}

Vue.use(loggerWorker, options)

after you will can use log example in global （Vue.prototype.$logworker)

config http request

<template lang="pug">
  #app
    router-view
</template>

<script>
export default {
  name: 'App',
  data () {
    return {
    }
  },
  created () {
    // the log http request method only support 'post', send the data format will use Array to log server
    const o = {
      url: 'https://test5-apiv6.maka.im/mls/v1/log', // log server address
      headers: {}, // http request headers
      timeout: 30000, // http request timeout (default 30000)
    }
    this.$logworker.updateAxiosConfig(o)  // config http request
  }
}
</script>

when you want to add log, you can do

export default {
  data () {
    return {
      num: 2
    }
  },
  computed: {
  },
  components: {
  },
  mounted () {
  },
  methods: {
    sendLogger () {
      // you can use this.$logworker.addLogger to add log

      // send String or number
      this.$logworker.addLogger('test log')

      // send Object
      this.$logworker.addLogger({ numtest: this.num++ })

      // send Array
      this.$logworker.addLogger([{ numtest: this.num++ }, 3423, 'ferwere'])
    }
  }
}