web-tracing-core 2.1.0 → 2.1.1

package/src/lib/eventBus.ts

@@ -1,97 +0,0 @@
-import type { AnyFun } from '../types'
-import { EVENTTYPES } from '../common'
-import { _support } from '../utils/global'
-
-interface EventHandler {
-  type: EVENTTYPES
-  callback: AnyFun
-}
-
-type Handlers = {
-  [key in EVENTTYPES]?: AnyFun[]
-}
-
-export class EventBus {
-  private handlers: Handlers
-  constructor() {
-    this.handlers = {}
-  }
-  /**
-   * 为目标类型事件添加回调
-   * @param handler 需要被添加的类型以及回调函数
-   */
-  addEvent(handler: EventHandler) {
-    !this.handlers[handler.type] && (this.handlers[handler.type] = [])
-    const funIndex = this._getCallbackIndex(handler)
-    if (funIndex === -1) {
-      this.handlers[handler.type]?.push(handler.callback)
-    }
-  }
-  /**
-   * 为目标类型事件删除回调
-   * @param handler 需要被删除的类型以及回调函数
-   */
-  delEvent(handler: EventHandler) {
-    const funIndex = this._getCallbackIndex(handler)
-    if (funIndex !== -1) {
-      this.handlers[handler.type]?.splice(funIndex, 1)
-    }
-  }
-  /**
-   * 为目标类型事件更改回调
-   * @param handler 需要被更改的类型以及回调函数
-   * @param newCallback 新的回调函数
-   */
-  changeEvent(handler: EventHandler, newCallback: AnyFun) {
-    const funIndex = this._getCallbackIndex(handler)
-    if (funIndex !== -1) {
-      this.handlers[handler.type]?.splice(funIndex, 1, newCallback)
-    }
-  }
-  /**
-   * 获取目标类型事件所有的回调
-   * @param type 事件类型
-   */
-  getEvent(type: EVENTTYPES): AnyFun[] {
-    return this.handlers[type] || []
-  }
-  /**
-   * 执行目标类型事件所有的回调
-   * @param type 事件类型
-   * @param args 额外参数
-   */
-  runEvent(type: EVENTTYPES, ...args: any[]): void {
-    const allEvent = this.getEvent(type)
-    allEvent.forEach(fun => {
-      fun(...args)
-    })
-  }
-  /**
-   * 获取函数在 callback 列表中的位置
-   */
-  private _getCallbackIndex(handler: EventHandler): number {
-    if (this.handlers[handler.type]) {
-      const callbackList = this.handlers[handler.type]
-      if (callbackList) {
-        return callbackList.findIndex(fun => fun === handler.callback)
-      } else {
-        return -1
-      }
-    } else {
-      return -1
-    }
-  }
-  /**
-   * 移除多个指定类型的事件监听
-   * @param types 事件类型数组
-   */
-  removeEvents(types: EVENTTYPES[]) {
-    types.forEach(type => {
-      delete this.handlers[type]
-    })
-  }
-}
-
-const eventBus = _support.eventBus || (_support.eventBus = new EventBus())
-
-export { eventBus }

package/src/lib/exportMethods.ts

@@ -1,208 +0,0 @@
-import type {
-  InternalOptions,
-  AnyFun,
-  TargetGather,
-  ElementOrList,
-  VoidFun
-} from '../types'
-import { options } from './options'
-import { _support } from '../utils/global'
-import { getIPs as _getIPs } from '../utils/getIps'
-import { validateMethods, deepCopy } from '../utils'
-import { handleSendError } from './err'
-import { handleSendPerformance } from './performance'
-import { handleSendEvent } from './event'
-import { handleSendPageView } from './pv'
-import { intersection } from './intersectionObserver'
-import { sendData } from './sendData'
-import { SDK_LOCAL_KEY } from '../common/config'
-import { LocalStorageUtil } from '../utils/localStorage'
-import { unzip } from '../lib/recordscreen'
-
-/**
- * 解压错误录屏数据
- */
-export function unzipRecordscreen(recordscreen: string) {
-  return unzip(recordscreen)
-}
-
-/**
- * 钩子：放入事件队列之前
- * @param fun 回调函数
- */
-export function beforePushEventList(fun: AnyFun): void {
-  if (!validateMethods('beforePushEventList')) return
-
-  options.value.beforePushEventList.push(fun)
-}
-
-/**
- * 钩子：发送之前
- * @param fun 回调函数
- */
-export function beforeSendData(fun: AnyFun): void {
-  if (!validateMethods('beforeSendData')) return
-
-  options.value.beforeSendData.push(fun)
-}
-
-/**
- * 钩子：发送之后
- * @param fun 回调函数
- */
-export function afterSendData(fun: AnyFun): void {
-  if (!validateMethods('afterSendData')) return
-
-  options.value.afterSendData.push(fun)
-}
-
-/**
- * 设置用户id
- * @param id 用户id
- */
-export function setUserUuid(id: string): void {
-  if (!validateMethods('setUserUuid')) return
-
-  options.value.userUuid = id
-}
-
-/**
- * 获取用户id（此id是手动设置的id）
- */
-export function getUserUuid(): string | void {
-  if (!validateMethods('getUserUuid')) return
-
-  return options.value.userUuid
-}
-
-/**
- * 获取sdk中的用户id
- */
-export function getSDKUserUuid(): string | void {
-  if (!validateMethods('getSDKUserUuid')) return
-
-  return options.value.sdkUserUuid
-}
-
-/**
- * 获取在sdk中记录的所有基础的信息（包括硬件，地理位置等等）
- */
-export function getBaseInfo(): object | void {
-  if (!validateMethods('getBaseInfo')) return
-
-  return {
-    ..._support.baseInfo.base,
-    userUuid: options.value.userUuid
-  }
-}
-
-/**
- * 获取首屏数据
- */
-export function getFirstScreen(): object | void {
-  if (!validateMethods('getFirstScreen')) return
-
-  return { ..._support.firstScreen }
-}
-
-/**
- * 主动触发error事件上报
- * @param options 自定义配置信息
- */
-export function traceError(options = {}, flush = false) {
-  if (!validateMethods('traceError')) return
-
-  return handleSendError(options, flush)
-}
-
-/**
- * 主动触发性能事件上报
- * @param options 自定义配置信息
- */
-export function tracePerformance(options = {}, flush = false) {
-  if (!validateMethods('tracePerformance')) return
-
-  return handleSendPerformance(options, flush)
-}
-
-/**
- * 主动触发事件上报
- * @param options 自定义配置信息
- */
-export function traceCustomEvent(options = {}, flush = false) {
-  if (!validateMethods('traceCustomEvent')) return
-
-  return handleSendEvent(options, flush)
-}
-
-/**
- * 主动触发pv事件上报
- * @param options 自定义配置信息
- */
-export function tracePageView(option = {}, flush = false) {
-  if (!validateMethods('tracePageView')) return
-
-  return handleSendPageView(option, flush)
-}
-
-/**
- * 获取公网ip
- */
-export function getIPs(): Promise<string> {
-  return _getIPs().then((res: any) => res[0])
-}
-
-/**
- * 曝光 - 对目标元素进行监听
- * @param params 附带的额外参数
- */
-export function intersectionObserver(gather: TargetGather): void {
-  if (!validateMethods('intersectionObserver')) return
-  intersection.observe(gather)
-}
-
-/**
- * 曝光 - 对目标元素进行取消监听
- */
-export function intersectionUnobserve(target: ElementOrList): void {
-  if (!validateMethods('intersectionUnobserve')) return
-  intersection.unobserve(target)
-}
-
-/**
- * 曝光 - 取消所有监听
- */
-export function intersectionDisconnect(): void {
-  if (!validateMethods('intersectionDisconnect')) return
-  intersection.disconnect()
-}
-
-/**
- * 手动发送本地数据
- */
-export function sendLocal(): void {
-  if (!validateMethods('sendData') && !options.value.localization) return
-  const localItem = LocalStorageUtil.getItem(SDK_LOCAL_KEY)
-  if (localItem) {
-    sendData.sendLocal(localItem)
-    LocalStorageUtil.removeItem(SDK_LOCAL_KEY)
-  }
-}
-
-/**
- * 设置本地化存储溢出后的回调
- * @param overFlowFun 回调函数
- */
-export function setLocalizationOverFlow(overFlowFun: VoidFun): void {
-  if (!validateMethods('localizationOverFlow') && !options.value.localization)
-    return
-  options.value.localizationOverFlow = overFlowFun
-}
-
-/**
- * 获取sdk内部的参数配置
- * 这个参数配置并不是入参配置，sdk内部的参数是整理过后的
- */
-export function getOptions(): InternalOptions {
-  return deepCopy(options.value)
-}

package/src/lib/http.ts

@@ -1,197 +0,0 @@
-import {
-  on,
-  isValidKey,
-  getTimestamp,
-  parseGetParams,
-  getBaseUrl
-} from '../utils'
-import { handleSendError } from './err'
-import { eventBus } from './eventBus'
-import { EVENTTYPES, SENDID } from '../common'
-import { options } from './options'
-import { handleSendPerformance } from './performance'
-// import { debug } from '../utils/debug'
-import { isRegExp } from '../utils/is'
-
-/**
- * fetch请求拦截
- */
-function interceptFetch(): void {
-  eventBus.addEvent({
-    type: EVENTTYPES.FETCH,
-    callback: async (
-      reqUrl: string,
-      _options: Partial<Request> = {},
-      res: Response,
-      fetchStart: number,
-      traceObj: Partial<Request> = {}
-    ) => {
-      const { method = 'GET', body = {} } = _options
-      const { url, status, statusText } = res
-      const requestMethod = String(method).toLocaleLowerCase()
-
-      if (isIgnoreHttp(url)) return
-
-      if (status === 200 || status === 304) {
-        if (options.value.performance.server) {
-          handleSendPerformance({
-            eventId: SENDID.SERVER,
-            requestUrl: url,
-            triggerTime: fetchStart,
-            duration: getTimestamp() - fetchStart,
-            responseStatus: status,
-            requestMethod,
-            requestType: 'fetch',
-            ...traceObj,
-            params: method.toUpperCase() === 'POST' ? body : parseGetParams(url)
-          })
-        }
-      } else if (options.value.error.server) {
-        handleSendError({
-          eventId: SENDID.SERVER,
-          triggerTime: fetchStart,
-          duration: getTimestamp() - fetchStart,
-          errMessage: statusText,
-          requestUrl: getBaseUrl(url),
-          responseStatus: status,
-          requestMethod,
-          requestType: 'fetch',
-          ...traceObj,
-          params: method.toUpperCase() === 'POST' ? body : parseGetParams(url)
-        })
-      }
-    }
-  })
-}
-
-class RequestTemplate {
-  requestUrl = '' // 请求地址
-  requestMethod = '' // 请求类型 GET POST
-  requestParams = {} // get请求的参数
-  triggerTime = -1 // 请求发生时间
-  constructor(config = {}) {
-    Object.keys(config).forEach(key => {
-      if (isValidKey(key, config)) {
-        this[key] = config[key] || null
-      }
-    })
-  }
-}
-
-/**
- * xhr 请求拦截
- */
-function interceptXHR(): void {
-  const _config = new RequestTemplate()
-
-  eventBus.addEvent({
-    type: EVENTTYPES.XHROPEN,
-    callback: (method, url) => {
-      _config.requestMethod = String(method).toLocaleLowerCase()
-      _config.requestUrl = url
-      _config.requestParams = parseGetParams(url)
-    }
-  })
-
-  eventBus.addEvent({
-    type: EVENTTYPES.XHRSEND,
-    callback: (that: XMLHttpRequest & any, body) => {
-      // readyState发生改变时触发,也就是请求状态改变时
-      // readyState 会依次变为 2,3,4 也就是会触发三次这里
-      on(that, EVENTTYPES.READYSTATECHANGE, function () {
-        const { readyState, status, responseURL, statusText } = that
-        const responseText =
-          that.responseType === '' || that.responseType === 'text'
-            ? that.responseText
-            : ''
-
-        if (readyState === 4) {
-          const requestUrl = responseURL || _config.requestUrl
-          if (isIgnoreHttp(requestUrl)) return
-
-          // 请求已完成,且响应已就绪
-          if (status === 200 || status === 304) {
-            if (options.value.performance.server) {
-              handleSendPerformance({
-                eventId: SENDID.SERVER,
-                requestUrl,
-                requestMethod: _config.requestMethod,
-                requestType: 'xhr',
-                responseStatus: status,
-                duration: getTimestamp() - _config.triggerTime,
-                params:
-                  _config.requestMethod === 'post'
-                    ? body
-                    : _config.requestParams
-              })
-            }
-          } else if (options.value.error.server) {
-            handleSendError({
-              eventId: SENDID.SERVER,
-              errMessage: statusText || responseText,
-              requestUrl,
-              requestMethod: _config.requestMethod,
-              requestType: 'xhr',
-              responseStatus: status,
-              params:
-                _config.requestMethod === 'post' ? body : _config.requestParams
-            })
-          }
-        }
-      })
-
-      _config.triggerTime = getTimestamp()
-    }
-  })
-}
-
-/**
- * 判断请求地址是否为需要拦截的
- * @param url 请求地址
- */
-function isIgnoreHttp(url: string): boolean {
-  if (!options.value.ignoreRequest.length) return false
-  if (!url) return false
-
-  return options.value.ignoreRequest.some(item => {
-    if (isRegExp(item)) {
-      if ((item as RegExp).test(url)) {
-        // debug(`ignoreRequest拦截成功 - 截条件:${item} 拦截地址:${url}`)
-        return true
-      } else {
-        return false
-      }
-    } else {
-      if (url === item) {
-        // debug(`ignoreRequest拦截成功 - 截条件:${item} 拦截地址:${url}`)
-        return true
-      } else {
-        return false
-      }
-    }
-  })
-}
-
-/**
- * 初始化http监控
- */
-function initHttp(): void {
-  if (!options.value.performance.server && !options.value.error.server) return
-
-  interceptXHR()
-  interceptFetch()
-}
-
-/**
- * 卸载所有请求监听
- */
-export function destroyHttp() {
-  // 清除HTTP请求相关的事件类型
-  eventBus.removeEvents([
-    EVENTTYPES.FETCH,
-    EVENTTYPES.XHROPEN,
-    EVENTTYPES.XHRSEND
-  ])
-}
-
-export { initHttp }

package/src/lib/intersectionObserver.ts

@@ -1,164 +0,0 @@
-import type { ElementOrList, TargetGather, AnyObj } from '../types'
-import { unKnowToArray, getTimestamp, getLocationHref } from '../utils'
-import { sendData } from './sendData'
-import { _support } from '../utils/global'
-import { SEDNEVENTTYPES } from '../common'
-
-interface IoMap {
-  [key: number]: IntersectionObserver
-}
-
-interface TargetMap {
-  target: Element
-  threshold: number
-  observeTime: number // sdk开始监视的时间
-  showTime?: number // sdk检测到的开始时间
-  showEndTime?: number // sdk检测到的结束时间
-  params?: AnyObj
-}
-
-/**
- * 元素曝光收集
- * 收集参数：曝光开始时间、曝光结束时间、被曝光元素上附带的额外参数
- * 收集契机：划出目标元素的收集范围
- */
-class Intersection {
-  private ioMap: IoMap = {}
-  private targetMap: TargetMap[] = []
-  private options = {
-    root: null,
-    rootMargin: '0px',
-    threshold: 0.5 // 阀值设为0.5，当只有比例达到一半时才触发回调函数
-  }
-  /**
-   * 针对 threshold 生成不同监听对象 (不允许同一个dom被两个监听对象监听)
-   * @param threshold 阈值
-   */
-  private initObserver(threshold: number) {
-    return new IntersectionObserver(
-      entries => {
-        entries.forEach(entry => {
-          if (entry.isIntersecting) {
-            const targetObj = this.targetMap.find(
-              mapTarget => mapTarget.target === entry.target
-            )
-            if (targetObj) {
-              targetObj.showTime = getTimestamp()
-            }
-          } else {
-            const targetObj = this.targetMap.find(
-              mapTarget => mapTarget.target === entry.target
-            )
-            if (targetObj) {
-              // 在进入页面时指定了没有在屏幕可视界面的dom，会立即触发这里
-              // 此时需要根据有无 showTime 区分是否为一个完整事件再去发送
-              if (!targetObj.showTime) return
-              targetObj.showEndTime = getTimestamp()
-              this.sendEvent(targetObj)
-            }
-          }
-        })
-      },
-      {
-        ...this.options,
-        threshold
-      }
-    )
-  }
-  /**
-   * 发送事件
-   */
-  private sendEvent(targetObj: TargetMap) {
-    sendData.emit({
-      eventType: SEDNEVENTTYPES.INTERSECTION,
-      triggerPageUrl: getLocationHref(),
-      ...targetObj
-    })
-  }
-  /**
-   * 开始观察目标元素
-   * 分为初始加载和过程中加载
-   * @param params 附带的额外参数
-   */
-  public observe(gather: TargetGather | TargetGather[]) {
-    const _gather = unKnowToArray(gather)
-    _gather.forEach(item => {
-      const _targetList = unKnowToArray(item.target)
-
-      if (!Object.prototype.hasOwnProperty.call(this.ioMap, item.threshold)) {
-        this.ioMap[item.threshold] = this.initObserver(item.threshold || 0.5)
-      }
-
-      _targetList.forEach(target => {
-        const index = this.targetMap.findIndex(
-          mapTarget => mapTarget.target === target
-        )
-        // 不允许重复观察
-        if (index === -1) {
-          this.ioMap[item.threshold].observe(target)
-
-          // 记录哪些元素被监听
-          this.targetMap.push({
-            target,
-            threshold: item.threshold,
-            observeTime: getTimestamp(), // 开始监听的时间
-            params: item.params
-          })
-        }
-      })
-    })
-  }
-  /**
-   * 对元素停止观察
-   */
-  public unobserve(target: ElementOrList) {
-    const _targetList = unKnowToArray(target)
-
-    _targetList.forEach(_target => {
-      // 第一步：找出此元素代表的 threshold 值
-      const targetIndex = this.targetMap.findIndex(
-        mapTarget => mapTarget.target === _target
-      )
-      if (targetIndex === -1) return // 不存在的元素则跳过
-
-      // 第二步：根据 threshold 值从 ioMap 获取到 io 实例
-      const io = this.ioMap[this.targetMap[targetIndex].threshold]
-      if (!io) return
-
-      this.targetMap.splice(targetIndex, 1)
-
-      // 第二步：io 实例执行 unobserve 方法
-      io.unobserve(_target)
-    })
-  }
-  /**
-   * 对所有元素停止观察
-   */
-  public disconnect() {
-    for (const key in this.ioMap) {
-      if (Object.prototype.hasOwnProperty.call(this.ioMap, key)) {
-        const io = this.ioMap[key]
-        io.disconnect()
-      }
-    }
-    this.targetMap = []
-    this.ioMap = {}
-  }
-}
-
-export let intersection: Intersection
-
-/**
- * 初始化曝光监听
- */
-export function initIntersection() {
-  _support.intersection = new Intersection()
-  intersection = _support.intersection
-}
-
-/**
- * 卸载所有曝光监听
- */
-export function destroyIntersection() {
-  intersection?.disconnect()
-}

package/src/lib/line-status.ts

@@ -1,45 +0,0 @@
-import { _support } from '../utils/global'
-import { EVENTTYPES } from '../common'
-import { eventBus } from './eventBus'
-import { debug } from '../utils/debug'
-
-/**
- * 监听网络状态
- * 当处于断网状态下的所有埋点事件都无效（认为此时采集的数据大部分是无效的）
- */
-export class LineStatus {
-  onLine = true
-  constructor() {
-    this.init()
-  }
-  init() {
-    eventBus.addEvent({
-      type: EVENTTYPES.OFFLINE,
-      callback: e => {
-        if (e.type === 'offline') {
-          debug('网络断开')
-          this.onLine = false
-        }
-      }
-    })
-    eventBus.addEvent({
-      type: EVENTTYPES.ONLINE,
-      callback: e => {
-        if (e.type === 'online') {
-          debug('网络连接')
-          this.onLine = true
-        }
-      }
-    })
-  }
-}
-
-export let lineStatus: LineStatus
-
-/**
- * 初始化网络监听
- */
-export function initLineStatus() {
-  _support.lineStatus = new LineStatus()
-  lineStatus = _support.lineStatus
-}