简介

基于vue+axios开发； 适用vue框架 适用噢啦项目；

安装

npm install oola-web-fbi@latest --registry=http://registry-npm.gzleihou.cn

• 在我们噢啦项目服务器上安装，使用cnpm

 cnpm install oola-web-fbi@latest --registry=http://registry-npm.gzleihou.cn 

使用

作为VUE插件，全局添加

  import Vue from 'vue'
  import { WebFBI } from 'oola-web-fbi'
  Vue.use(WebFBI, {
    api: String, // 收集数据的接口地址
    a2: String, // 用于md5加密的字段值
    securityKey: String, // 用于md5加密的字段值
    params: Object // 需要收集的数据字段，相同字段会覆盖默认定义收集的数据字段
  })

VUE组件指令

<component v-fbi="{text: '行为描述'}"><component> // 默认 click行为
// 或
<component v-fbi.${actionEvent}="{text: '行为描述'}"><component>
// actionEvent 目前只支持 click行为
// 所传参数相同字段会覆盖默认定义收集的数据字段，且优先级最高

VUE全局方法

mounted: {
  this.$fbi.sendServer({action: 'click', text: '行为描述'})
  // 所传参数相同字段会覆盖默认定义收集的数据字段，且优先级最高
}

独立方法（不依赖VUE）

  import { GwebFBI } from 'oola-web-fbi'
  const fbi = GwebFBI({
      api: String, // 收集数据的接口地址
      a2: String, // 用于md5加密的字段值
      securityKey: String, // 用于md5加密的字段值
      params: Object // 需要收集的数据字段，相同字段会覆盖默认定义收集的数据字段
    })
  fbi.sendServer({action: 'click', text: '行为描述'})

• 如果作为VUE插件和独立方法一起使用，两种方法返回的都是同一个对象，配置项会被后定义覆盖，建议把配置项提取出来，避免混乱

  // fbi.config.js
  export const fbiConfig = {
    api: String, // 收集数据的接口地址
    a2: String, // 用于md5加密的字段值
    securityKey: String, // 用于md5加密的字段值
    params: Object // 需要收集的数据字段，相同字段会覆盖默认定义收集的数据字段
  }

目前默认定义收集的数据字段，字段值已自动获取并设置

  {
    channel: getChannel(), // 渠道号，与前端channel业务逻辑密切相关，存储在sessionStorage上的channelCode字段或firstChannelCode字段
    spread: getSpread(), // URL上的参数spread的值
    host: location.host,
    url: location.url,
    href: location.href,
    referer: location.referer, // URL来源，
    system: BrowserSystem.system, // 系统类型，如：ios，android
    vsystem: BrowserSystem.Version, // 系统版本号
    platform: BrowserSystem.platform, // 访问场景，如：oola_app，wx，uc，weibo
    timestamp: Date.now(), // 时间戳
    imei: getVisitor(),
    userId: getUserId() // 用户id，与前端登录系统密切相关，存储在sessionStorage上的userId字段
  }

以上字段可以被覆盖