fzsdk-test v1.7.0

分众埋点sdk

简介

分众前端项目埋点SDK,支持PC端,可全埋点+手动埋点相配合采集用户行为,用户信息数据监控,定位异常

数据上报

采用图片打点 实时上报服务端

全埋点

安装npm包之后 在项目入口文件进行初始化 即可开启全埋点

访问页面

用户进行页面访问或页面切换时,自动采集其访问的页面地址以及来源页面地址

数据格式:

{
      Platform, //平台名称
      SendEventsTime, //发送时间
      ProjectId,//项目id
      BasicsField,//用户的系统,浏览器等基本信息
      Events: [
        {
          EventName:'PageView',//事件名称
          PreviousUrl,//来源地址
          EventTime,//事件时间
          CurrentUrl//当前地址
        }
      ]
}

页面停留时长

用户进行页面访问时自动采集当前页面的停留时长并在关闭页面或者切换页面前将页面地址以及停留时长进行上报

数据格式:

{
      Platform, //平台名称
      SendEventsTime, //发送时间
      ProjectId,//项目id
      BasicsField,//用户的系统,浏览器等基本信息
      Events: [
        {
          EventName:'Timing',//事件名称
          EventTime,//事件时间
          CurrentUrl,//当前地址
          Duration//停留时长 单位秒
        }
      ]
}

点击

按钮点击时采集当前页面地址以及点击的按钮dom信息进行上报

数据格式:

{
      Platform, //平台名称
      SendEventsTime, //发送时间
      ProjectId,//项目id
      BasicsField,//用户的系统,浏览器等基本信息
      Events: [
        {
          EventName:'Click',//事件名称
          CurrentUrl,//当前地址
          Expath,//点击的按钮的dom信息
          Type //点击的按钮名称
        }
      ]
}

静态资源异常

当浏览器请求项目中依赖的静态资源出现异常时,会将静态资源的请求地址 以及发起请求的时间进行上报

数据格式:

{
      Platform, //平台名称
      SendEventsTime, //发送时间
      ProjectId,//项目id
      BasicsField,//用户的系统,浏览器等基本信息
      Events: [
        {
          EventName:'SourceError',//事件名称
          EventTime,//事件时间
          CurrentUrl,//当前地址
          FileSrc,//加载失败的资源路径
          Expath //最后一个交互事件
        }
      ]
}

服务器请求

每一次的请求都会将请求地址,请求参数,发起请求时间以及数据返回时间进行上报,若服务器请求异常,会后端返回的异常数据一并上报(服务器请求正常时 后端返回的数据不会上报)

数据格式:

xhr

{
      Platform, //平台名称
      SendEventsTime, //发送时间
      ProjectId,//项目id
      BasicsField,//用户的系统,浏览器等基本信息
      Events: [
        {
          EventName:'HttpRequest',//事件名称
          EventTime,//事件时间
          Duration,//请求响应时间
          Path,//请求地址
          Params,//请求参数
          Status,//响应状态
          Msg,//服务器异常时的错误信息
          CurrentUrl//当前地址
        }
      ]
}

fetch

{
      Platform, //平台名称
      SendEventsTime, //发送时间
      ProjectId,//项目id
      BasicsField,//用户的系统,浏览器等基本信息
      Events: [
        {
          EventName:'HttpRequest',//事件名称
          EventTime,//事件时间
          Duration,//请求响应时间
          Path,//请求地址
          Params,//请求参数
          Status,//响应状态
          Msg,//服务器异常时的错误信息
          CurrentUrl//当前地址
        }
      ]
}

页面崩溃,白屏

监测页面崩溃和白屏时,将页面地址进行上报

数据格式:

{
      Platform, //平台名称
      SendEventsTime, //发送时间
      ProjectId,//项目id
      BasicsField,//用户的系统,浏览器等基本信息
      Events: [
        {
          EventName:'BlankScreen',//事件名称
          EventTime,//事件时间
          CurrentUrl//当前地址
        }
      ]
}
{
      Platform, //平台名称
      SendEventsTime, //发送时间
      ProjectId,//项目id
      BasicsField,//用户的系统,浏览器等基本信息
      Events: [
        {
          EventName:'Warning',//事件名称
          EventTime,//事件时间
          CurrentUrl//当前地址
        }
      ]
}

js错误

当页面出现js错误时 将页面地址, 错误信息,报错的行列信息进行上报

数据格式:

{
      Platform, //平台名称
      SendEventsTime, //发送时间
      ProjectId,//项目id
      BasicsField,//用户的系统,浏览器等基本信息
      Events: [
        {
          EventName:'JsError',//事件名称
          Msg,//错误信息
          FilePath,//报错文件路径
          Stack,//报错行列信息
          Expath,//最后一个交互事件
          EventTime,//事件时间
          CurrentUrl//当前地址
        }
      ]
}

安装及使用

1. 安装

//npm安装
npm install fzsdk
//yarn安装
yarn add fssdk

2. 初始化(全埋点)

//在项目入口文件引入埋点的sdk
import fzsdk from 'fzsdk'
//初始化并配置
fzsdk.init({
    targetUrl:'...',//上报服务器的地址
    Platform:'...',//数据来源, ios,android Web 小程序(公共字段)
    ProjectId :'...',//项目id
    Version:'...'//项目版本
})

3. 手动埋点

fzsdk.emit(type,data)
//type: 手动埋点的事件类型 string
//data: 手动埋点需要上报的数据对象 object

配置

• targetUrl 上报服务器的地址 默认地址10.216.10.128/dw.gif (测试) https://ulog.focusmedia.tech/dw.gif(生产)
• Platform 平台名称
• ProjectId 项目id
• Version 项目版本