@itmirror/im-track-jssdk

前端埋点js-sdk，支持原生、Vue使用

安装

npm i @itmirror/im-track-jssdk --save

浏览器中使用

// 原生调用
<script src="./lib/index.js"></script>
imTrack.init({
    url: 'http://demo.com/api/log',
    type: 'post'
})
// 保存日志到发送队列
imTrack.addToQueue('eventName', {user: 'bob'});
// get方式提交一条日志
imTrack.get('eventName', {user: 'bob', type: 'get'});
// post方式提交一条日志
imTrack.post('eventName', {user: 'bob', type: 'post'});
// 设置附加信息
imTrack.setAttach({eid: 'eid123', shop: 'shop023'});
// 增加一条附加信息
imTrack.addAttach('user', 'bob');
// 删除一条附加信息
imTrack.removeAttach('user');
// 设置事件触发回调
imTrack.setEventCallback((data) => {
    console.log('event callback data:', data)
});

Vue中使用

import imTrack from '@itmirror/im-track-jssdk'
Vue.use(imTrack)
this.imTrack.init({
    app: 'vue-demo',
    url: '/api/common/log',
    attach: { os: 'ios' },
    eventCallback: (data) => {
        console.log('imTrack:', data)
    }
})
// 保存日志到发送队列
this.imTrack.addToQueue('vue-log', {user: 'bob'})
// get方式提交一条日志
this.imTrack.get('vue-log', {user: 'bob', type: 'get'});
// post方式提交一条日志
this.imTrack.post('vue-log', {user: 'bob', type: 'post'});
// 设置附加信息
this.imTrack.setAttach({eid: 'eid123', shop: 'shop023'});
// 增加一条附加信息
this.imTrack.addAttach('user', 'bob');
// 删除一条附加信息
this.imTrack.removeAttach('user');
// 设置事件触发回调
this.imTrack.setEventCallback((data) => {
    console.log('event callback data:', data)
});
// click事件
<div v-track:click="{commodityId: _id, name: 'commodity-click'}"></div>
// scroll事件
<div v-track:scroll="{commodityId: _id, name: 'detail-scroll'}"></div>

参数

字段	默认值	类型	描述
url	''	String	日志上传接口
type	'beacon'	String	请求方式: beacon、get、post，空时不会上报
attach	null	Any	数据上传附加的信息
delayTime	2000	Number	上报延迟时间，该时间内会累计事件再统一上报，单位毫秒
history	true	Boolean	是否监听 history 变更事件
hashchange	true	Boolean	是否监听 hash 变更事件
http	true	Boolean	是否监听 http 请求错误事件，包含 >= 400 的响应
error	true	Boolean	是否监听错误事件
errorMaxDuplicate	1	Number	重复上报错误的次数
click	true	Boolean	是否监听 click 事件
scroll	true	Boolean	是否监听 window.scroll 事件，只记录scroll停止时的值，300ms未滚动即认为滚动停止
eventCallback	null	Function	事件触发回调

上报数据

结构: {event: 'eventName', data: {}}

• app@TP: 页面停留时间统计
• app@Click: click事件
• app@Scroll: scroll事件
• app@Error: 错误事件
• app@$Click: vue钩子绑定的click事件
• app@$Scroll: vue钩子绑定的scroll事件