按需集成插件

一些不常用的需求由于使用场景少，无法默认集成在SDK中，您可以通过自定义插件的方式按需集成。

使用插件包

refreshPreStartContext

以start时的conext刷新start之前预发送队列里的context。

示例代码：

import { refreshPreStartContext } from '@owl-js/integrations/refreshPreStartContext'
import client from '@owl-js/web'

client('init', {
  ...
  integrations: [refreshPreStartContext()]
  ...
})

captureConsole

在调用全局console对象的时候，将调用参数包装成JS错误并上报到平台上。指定需要hook的levels数组，包括'log'，'info'，'warn'，'error'，'debug'，'assert'等。由于hook了全局的console对象，所以在控制台中调用console相关方法也会触发上报。

示例代码：

import { captureConsole } from '@owl-js/integrations/captureConsole'
import client from '@owl-js/web'

client('init', {
  ...
  // levels 必填， 如下指定需要hook console的哪些方法，所示的功能则是hook console.error并将调用参数包装成JS 错误 并上报到平台上
  integrations: [captureConsole({ levels: ['error'] })]
  ...
})

自定义插件

如果插件包里的插件无法满足业务需求，您可以自行发布一个插件包。

1. 发布插件包。

插件的实现可以是直接返回一个对象，或一个方法。您可以传入一些配置，返回一个对象，只要这个对象满足integrations类型约定。

import client from '@owl-js/web'
client('init',{
  ...
  integrations: [{
    name: 'name', // 插件名称，用于去重
    setup: (client) => void, // 初始化代码, 传入的client 是监控实例
    tearDown: () => void, // 可选，有副作用时需要提供，会在SDK被调用destroy的时候执行
  }],
  ...
})

示例代码如下：

import client from '@owl-js/web'

// 一个自定义插件
// 功能：以start时的context 刷新预收集队列的context
const refreshPreStartContext = () => ({
  name: 'refreshPreStartContext',
  setup: (client: WebClient) => {
    client.on('start', () => {
      const preStartQueue = client.getPreStartQueue()
      preStartQueue.forEach((ev: WebReportEvent, index: number) => {
        preStartQueue[index] = {
          ...ev,
          overrides: {
            ...(ev.overrides ?? {}),
            context: client?.context?.toString() || {},
          },
        }
      })
    })
  },
})

client('init',{
  ...
  // 使用此插件
  integrations: [refreshPreStartContext()],
  ...
})

2. 集成到插件包。

// 从官方的插件包中引入某一个插件
import { refreshPreStartContext } from '@owl-js/integrations'
import client from '@owl-js/web'

client('init', {
  ...
  integrations: [refreshPreStartContext()]
  ...
})