Skip to content

Latest commit

 

History

History
334 lines (302 loc) · 13.1 KB

option.md

File metadata and controls

334 lines (302 loc) · 13.1 KB

全局函数

log

interface LogTypes {
  message: string | number | Object
  tag?: string;
  level?: Severity;
  ex?: any;
}
export declare function log({ message, tag, level, ex }: LogTypes): void;

手动上报函数具体使用

MitoVue

初始化Vue的插件，用于npm引入时的监控Vue的报错，详细使用

SDK_VERSION

sdk版本：string

SDK_NAME

sdk名称：string

errorBoundaryReport

react@next的ErrorBoundary的错误上报函数具体使用

options

options.property

Name Type Default Description
dsn string "" dsn服务地址，上报接口的地址，post方法，可选useImgUpload方式
trackDsn string "" trackDsn服务地址，埋点上报接口的地址，为空时不上报，post方法
disabled boolean false 默认是开启状态，为true时，会将sdk禁用
apikey string "" 每个项目对应一个apikey，用于存放错误集合的唯一标识
debug boolean false 默认不会在控制台打印用户行为和错误信息，为true时将会在控台打印，推荐本地调试时置为true
useImgUpload boolean false 为true时，则使用img上报的方式，会在dsn后面追加data=encodeURIComponent(reportData)，在服务端接受时需要decodeURIComponent，默认为false。（小程序只能用wx.request上报的方式，也就是xhr，而且走img请求的话，url是有字符长度限制的，所以推荐走xhr）
enableTraceId boolean false 为true时，页面的所有请求都会生成一个uuid，放入请求头中，和配置项：traceIdFieldName搭配使用
throttleDelayTime number 0 默认会收集click到的标签，该参数可以设置按钮点击节流时间
traceIdFieldName string Trace-Id 如果enableTraceId为true时，将会在所有请求头中添加key为Trace-Id，value为uuid的traceId，与includeHttpUrlTraceIdRegExp搭配使用
includeHttpUrlTraceIdRegExp RegExp null 如果你开启了enableTraceId，还需要配置该属性，比如将改属性置为：/api/，那么所有包含api的的接口地址都将塞入traceId
maxBreadcrumbs number 20 用户行为存放的最大容量，最大是100，当你配置超过100时，最终还是会设置成100，一方面是防止占更多的内存、一方面是保存超过100条用户行为没多大意义
filterXhrUrlRegExp RegExp null 默认为空，所有ajax都会被监听，不为空时，filterXhrUrlRegExp.test(xhr.url)为true时过滤
silentXhr boolean false 默认会监控xhr，为true时，将不再监控
silentFetch boolean false 默认会监控fetch，为true时，将不再监控
silentConsole boolean false 默认会监控console，为true时，将不再监控
silentDom boolean false 默认会监听click事件，当用户点击的标签不是body时就会被放入breadcrumb，为true，将不在监听
silentHistory boolean false 默认会监控popstate、pushState、replaceState，为true时，将不再监控
silentError boolean false 默认会监控error，为true时，将不在监控
silentUnhandledrejection boolean false 默认会监控unhandledrejection，为true时，将不在监控
silentHashchange boolean false 默认会监控hashchange，为true时，将不在监控
silentVue boolean false 默认会监控Vue的错误，为true时，将不在监控
silentWxOnError boolean false 默认会监控微信小程序App的onError错误，为true时，将不在监控
silentWxOnUnhandledRejection boolean false 默认会监控微信小程序App的onUnhandledRejection，为true时，将不在监控
silentWxOnPageNotFound boolean false 默认会监控微信小程序App的onPageNotFound，为true时，将不在监控
silentWxOnShareAppMessage boolean false 默认会监控微信小程序App的onShareAppMessage，为true时，将不在监控
silentMiniRoute boolean false 默认会监控微信小程序App的路由跳转，为true时，将不在监控
maxDuplicateCount number 2 最多可重复上报同一个错误的次数

**示例：**用户行为栈最大长度为30

MITO.init({
  ...
  maxBreadcrumbs: 30
})

options.hook

export interface HooksTypes {
  /**
   * 钩子函数，配置发送到服务端的xhr
   * 可以对当前xhr实例做一些配置：xhr.setRequestHeader()、xhr.withCredentials
   * 会在xhr.setRequestHeader('Content-Type', 'text/plain;charset=UTF-8')、
   * xhr.withCredentials = true,后面调用该函数
   * ../param xhr XMLHttpRequest的实例
   */
  configReportXhr?(xhr: XMLHttpRequest): void
  /**
   * 钩子函数，在每次发送事件前会调用
   *
   * ../param event 有SDK生成的错误事件
   * ../returns 如果返回 null | undefined | boolean 时，将忽略本次上传
   */
  beforeDataReport?(event: TransportDataType): Promise<TransportDataType | null | CANCEL> | TransportDataType | CANCEL | null
  /**
   * 钩子函数，每次发送前都会调用，设置上报到服务端的地址
   *
   * @param {string} url 上报到服务端的地址
   * @returns {(string | null)} 返回string
   * @memberof HooksTypes
   */
  configReportUrl?(url: string): string
  /**
   * 钩子函数，在每次添加用户行为事件前都会调用
   *
   * ../param breadcrumb 由SDK生成的breacrumb事件栈
   * ../param hint 当次的生成的breadcrumb数据
   * ../returns 如果返回 null | undefined | boolean 时，将忽略本次的push
   */
  beforePushBreadcrumb?(breadcrumb: Breadcrumb, hint: BreadcrumbPushData): BreadcrumbPushData | CANCEL
  /**
   * 在状态小于400并且不等于0的时候回调用当前hook
   * ../param data 请求状态为200时返回的响应体
   * ../returns 如果返回 null | undefined | boolean 时，将忽略本次的上传
   */
  // afterSuccessHttp?<T>(data: T): string | CANCEL
  /**
   * 钩子函数，拦截用户页面的ajax请求，并在ajax请求发送前执行该hook，可以对用户发送的ajax请求做xhr.setRequestHeader
   * ../param config 当前请求的
   */
  beforeAppAjaxSend?(config: IRequestHeaderConfig, setRequestHeader: IBeforeAppAjaxSendConfig): void
  /**
   * 钩子函数，在beforeDataReport后面调用，在整合上报数据和本身SDK信息数据前调用，当前函数执行完后立即将数据错误信息上报至服务端
   * trackerId表示用户唯一键（可以理解成userId），需要trackerId的意义可以区分每个错误影响的用户数量
   */
  backTrackerId?(): string | number
}

configReportXhr

示例：上报服务端（你配置的dsn或trackDsn接口）时，可以自定义设置请求头，如下所示，设置了Content-Type

MITO.init({
  ...
  configReportXhr(xhr){
  	xhr.setRequestHeader('Content-Type', 'text/plain;charset=UTF-8')
	}
})

beforeDataReport

function(event: TransportDataType): Promise<TransportDataType | null | CANCEL> | TransportDataType | CANCEL | null
interface TransportDataType{
  authInfo: AuthInfo
  breadcrumb: BreadcrumbPushData[]
  data: ReportDataType
  record?: any[]
}
interface ReportDataType {
  type?: ERRORTYPES
  message?: string
  url: string
  name?: string
  stack?: any
  time?: number
  errorId?: number
  level: number
  // ajax
  elapsedTime?: number
  request?: {
    httpType?: string
    method: string
    url: string
    data: any
  }
  response?: {
    status: number
    statusText: string
    description: string
  }
  // vue
  componentName?: string
  propsData?: any
  // logerror
  customTag?: string
}

示例：如果错误事件发生在test.com/test地址下则不上报服务端

MITO.init({
  ...
  async beforeDataReport(event){
  	if (event.data.url === 'test.com/test') return false
    // 注意:判断是否调用dsn还是trackDsn的规则
    // (event.data.actionType === undefined || !event.data.isTrackData) 为true那么认为此次上报的类型是错误上报，否则是埋点上报
	}
})

beforePushBreadcrumb

function(breadcrumb: Breadcrumb, hint: BreadcrumbPushData)
interface BreadcrumbPushData {
  type: string
  data: any
}
export class Breadcrumb{
  private maxBreadcrumbs:number
  private stack:BreadcrumbPushData[]
  push()
  getStack()
}

示例：如果type是Console的就过滤，不会push到当前用户行为栈中

MITO.init({
  ...
  beforePushBreadcrumb(breadcrumb, hint){
  	if (hint.type === 'Console') return false
	}
})

beforeAppAjaxSend

示例：拦截用户页面的ajax请求，并在ajax请求发送前执行该hook。在页面所有ajax请求时添加请求头，类似axios的request拦截器，

MITO.init({
  ...
  beforeAppAjaxSend({method, url}, setRequestHeader){
  	if (method === 'GET') {
  		setRequestHeader('Content-Type', 'text/plain;charset=UTF-8')
  	}
	}
})

backTrackerId

示例：trackerId表示用户唯一键（可以理解成userId），可以用uuid生成或用直接用userId，为了方便区分每个错误的用户数，会放入authInfo对象中

MITO.init({
  ...
  backTrackerId(){
  	// 比如userId在localStorage中
  	return localStorage.getItem('userId')
	}
})

wx-mini.hook

  /**
   * wx小程序上报时的
   */
  configReportWxRequest?(): WechatMiniprogram.RequestOption
	/**
   * wx小程序的App下的onLaunch执行完后再执行以下hook
   */
  appOnLaunch?(options: WechatMiniprogram.App.LaunchShowOption): void
  /**
   * wx小程序的App下的OnShow执行完后再执行以下hook
   */
  appOnShow?(options: WechatMiniprogram.App.LaunchShowOption): void
  /**
   * wx小程序的App下的OnHide执行完后再执行以下hook
   */
  appOnHide?(page: IWxPageInstance): void
  /**
   * wx小程序的App下的onPageNotFound执行完后再执行以下hook
   */
  onPageNotFound?(data: WechatMiniprogram.OnPageNotFoundCallbackResult): void
  /**
   * 先执行hook:pageOnShow再执行wx小程序的Page下的onShow
   */
  pageOnShow?(page: IWxPageInstance): void
  /**
   * 先执行hook:pageOnHide再执行wx小程序的Page下的onHide
   */
  pageOnHide?(page: IWxPageInstance): void
  /**
   * 先执行hook:onShareAppMessage再执行wx小程序的Page下的onShareAppMessage
   */
  onShareAppMessage?(options: WechatMiniprogram.Page.IShareAppMessageOption & IWxPageInstance): void
  /**
   * 先执行hook:onShareTimeline再执行wx小程序的Page下的onShareTimeline
   */
  onShareTimeline?(page: IWxPageInstance): void
  /**
   * 先执行hook:onTabItemTap再执行wx小程序的Page下的onTabItemTap
   */
  onTabItemTap?(options: WechatMiniprogram.Page.ITabItemTapOption & IWxPageInstance): void
  /**
   * 重写wx.NavigateToMiniProgram将里面的参数抛出来，便于在跳转时更改query和extraData
   * @param options
   */
  wxNavigateToMiniProgram?(options: WechatMiniprogram.NavigateToMiniProgramOption): WechatMiniprogram.NavigateToMiniProgramOption
  /**
   * 代理Action中所有函数，拿到第一个参数并抛出hook
   * @param e
   */
  triggerWxEvent?(e: WechatMiniprogram.BaseEvent): void

示例

MITO.init({
  ...
  appOnLaunch(options){
  	console.log('wx app打开', options)
	},
  pageOnShow(options) {
    // 页面打开，用于无痕埋点
  },
  pageOnHide(options) {
    // 页面离开 用于无痕埋点
  },
  wxNavigateToMiniProgram(options) {
    // 小程序跳小程序时query添加参数
    options.path = options.path + '?params=something'
    return options
  },
  triggerWxEvent(e) {
    // 如果是用户触发的事件，可以拿到以下信息
    // e.currentTarget.dataset
    // e.currentTarget.id
    // e.currentTarget.type
  },
  configReportWxRequest() {
    return {
      header: {
        'Content-Type': 'text/plain; charset=UTF-8'
      },
      dataType: 'text'
    }
  }
})