info-collection

v0.1.44

Published

4 years ago

客户端信息收集插件

0High
0Medium
0Low

kaindy7633

info-collection (客户端信息收集)

使用

安装

从 npmjs.org 安装

$ npm i -S info-collection

从淘宝NPM镜像安装

$ npm i -S info-collection --registry=https://registry.npm.taobao.org

从私有NPM源安装

$ npm i -S info-collection --registry=http://front-end.testuoko.com:4873

引入

import BehaviorInfoCollection from 'info-collection';

目前版本中，lib 内置两个类实现， BaseInfoCollection 和 BehaviorInfoCollection ，分别对应基础信息收集和行为信息收集。后期的开发中，所有类型的信息收集都将继承于 BaseInfoCollection 类，子类将通过 module.exports 暴露出来。

BehaviorInfoCollection 类直接继承 BaseInfoCollection，实际使用时直接引入 BehaviorInfoCollection 类即可。

获取版本号和项目名称

首先可以加载 package.json 文件，从这里获取项目版本号和项目名称，如果没有则可以忽略掉。

const packageInfo = require('../package.json');

实例化

直接实例化引入的类即可。实例化参数接收一个对象，配置参数如下：

startCollectionOfEnv: 在哪种环境下开启信息收集，默认生产环境 (production), 它接收一个数组，可以将多个环境变量放在数组中，表示在这些环境中都开启信息收集。此参数是可选的。
uploadInfoAddr: 信息上报的API地址，此参数是必须的，否则会抛出异常。
getClientPlatformTypeApi: 获取系统分类数据的API地址，此参数是必须的，否则会抛出异常。
appVersion: 项目版本号
appName: 项目名称

 const InfoCollectInstance = new BehaviorInfoCollection({
    startCollectionOfEnv: ['development'],  // 测试临时使用 默认只在生产环境下启用采集
    uploadInfoAddr: 'http://api-gateway.testuoko.com/netflow/client/netflow_trace',
    getClientPlatformTypeApi: `http://api-gateway.testuoko.com:7070/netflow/client_platform_type`,
    appVersion: packageInfo.version || '',
    appName: packageInfo.name || '',
  });

调用方法收集信息并上报

先调用实例方法 dataInfo, 它返回一个 Promise, 解析后，调用方法 pushInfoData 进行上报。

InfoCollectInstance.dataInfo().then(result => {
  if (result) {
    // 上报信息
    InfoCollectInstance.pushInfoData(result);
  }
});

将实例对象挂载到全局对象 Window 上

window.InfoCollectInstance = InfoCollectInstance || {};

注意： 在 TS 项目中，我们需要为实例对象增加一个声明，在 Window 对象上。

declare global {
  interface Window { < 这里填入你实例化后的名称,如：InfoCollectInstance >: any; }
}

整个初始化并上报基础信息的操作都包含在一个 try...catch 中，最终的示例代码如下：

declare global {
  interface Window { InfoCollectInstance: any; }
}

// 数据信息收集埋点
try {
  // 获取应用的版本号
  const packageInfo = require('../package.json');
  // 实例化信息采集实例
  const InfoCollectInstance = new BehaviorInfoCollection({
    startCollectionOfEnv: ['development'],  // 测试临时使用 默认只在生产环境下启用采集
    uploadInfoAddr: 'http://api-gateway.testuoko.com/netflow/client/netflow_trace',
    getClientPlatformTypeApi: `http://api-gateway.testuoko.com:7070/netflow/client_platform_type`,
    appVersion: packageInfo.version,
    appName: packageInfo.name,
  });
  // 获取需要上报的信息对象
  InfoCollectInstance.dataInfo().then(result => {
    if (result) {
      // 上报信息
      InfoCollectInstance.pushInfoData(result);
    }
  });

  // 将实例对象挂载到 window对象上
  window.InfoCollectInstance = InfoCollectInstance || {};
} catch (e) {
  throw new Error(e || `An unknown error has occurred!`);
}

配置

除了上面提到的 startCollectionOfEnv、uploadInfoAddr、 getClientPlatformTypeApi、 appVersion、 appName 之外，信息收集SDK还支持以下配置参数：

allDeviceType: 是否对所有类型设备进行采集，如：PC、Mobile? 默认为 true
onlyPCDeviceType: 仅对PC设备进行采集，默认为 false, 若设置为 true, 则 allDeviceType 和 onlyMobileDeviceType 会自动被设置为 false。
onlyMobileDeviceType: 仅对移动设备进行采集，默认为 false, 若设置为 true, 则 allDeviceType 和 onlyPCDeviceType 会自动被设置为 false
sysCode: 系统编号，可以通过手动配置参数的形式直接指定当前系统的编号。若配置了此参数，就不会向远端API请求获取系统编号了。

API

基类 `BaseInfoCollection` 提供的API：

init()：初始化环境配置，在实例化时会被调用，返回布尔值。
getUserOS()：返回当前客户端系统类型和版本号，值为一个对象，分别包含 name 和 version
getUserBrowserInfo()：返回当前客户端浏览器的类型和版本号，值为一个对象，分别包含 name 和 version
getUserLocalInfo()：访问外部第三方API，返回一个 Promise，解析出一个对象。
getUserResolution()：返回当前用户的屏幕分辨率
sysCode()：返回系统编号
getNetworkType()：返回当前用户使用的网络类型
getCurrentURL()：返回当前用户访问的链接
isFirstVisit()：返回是否是第一次访问
isLogin()：返回是否登陆
getDistinctId()：返回每一位用户的唯一标识码，16位Hash，存储在用户设备本地
_getUserDeviceType()：返回当前用户设备类型，PC 或 Mobile
dataInfo()：返回收集的基础信息对象
pushInfoData()：上报信息，接收两个参数，pushData 表示需要上报的数据， reportType 表示上报类型，分别有 base_info 基础信息上报和 behavior_info 行为信息上报。

行为信息类 `BehaviorInfoCollection` 提供的API：

userLoginEvent()：用户登陆事件
userLogoutEvent()：用户登出事件
pageViewEvent()：页面浏览事件
detailViewEvent()：详情页浏览事件
menuSwitchEvent()：菜单跳转事件
handleClickEvent(): 点击事件
searchEvent(): 搜索事件
adTouchEvent()：广告转换事件
listSearchEvent()：查询列表事件
newItemSubmitEvent()：新建条目提交事件
updateItemSubmitEvent()：修改条目提交事件
deleteItemSubmitEvent()：删除条目提交事件
uploadInfoEvent()：上传事件
downloadInfoEvent()：下载事件

Published

Vulnerabilities

Links

Maintainers

Keywords

Readme