1.0.11 • Published 4 years ago

web-event-tracking v1.0.11

Weekly downloads
2
License
ISC
Repository
github
Last release
4 years ago

web-event-tracking

web 埋点

查看 demo

引入方法：

script 标签

下载 index.min.js

<script src="./lib/web-event-tracking/index.min.js"></script>
es6
npm i web-event-tracking -S
import 'web-event-tracking/dist/index.min'

修改默认配置：

window.tracking.setConfig({
  trackingServerUrl: 'http://tracking.abc.com/', // 埋点服务器接口url
  appid: 'b1651f4562174c06',
  token: 'kgfk8i987kgfkjhwer\u1234',
  distinctIdKey: 'distinctId', // cookie中用来存区分用户的key
  sourceKey: 'source', // url中用来标记来源渠道的key
  defaultSource: 'message', // 默认来源渠道
  interval: 5000 // 发送间隔，单位毫秒
})

方法说明：

1、点击事件
window.tracking.click(e)
2、跳转至第三方支付平台
window.tracking.toThirdPartyPayment('alipay')
3、跳转至某外链
window.tracking.toExternalUrl('http://www.bcd.com')
4、设置手机号
window.tracking.setPhone('13512347852')
5、验证码输入正确
window.tracking.submitRightCaptcha()
6、验证码输入错误
window.tracking.submitWrongCaptcha()
7、切换验证码
window.tracking.switchCaptcha()
8、添加自定义事件
window.tracking.addEvent({
    event: 'customEvent', // 自定义事件名称
    ... // 其他自定义属性
})
9、手动触发向服务器发送埋点数据（默认 5 秒发送一次，页面关闭时发送一次）
window.trackingPost()

后台推送数据接口

url: http://tracking.abc.com/
method:Post
dataFormat(数据格式):
{
    "appid": "e1a51f2257934e99",
    "token": "MzExNTg4NjkzNjMwNzc3\u003d",
    "events": [
        `{
            event: "pushState",
            currentUrl: "http://www.abc.com#pageA", //从哪个页面（当前页面）跳转过去
            targetUrl: "http://www.abc.com#pageB", //跳到哪个页面
            distinctId: "1123", //区分用户的 ID,第一次打开页面时新建 uuid,存放在 cookie 中
            phone: "18812345236", //用户手机号
            source: "message", //渠道来源，message:短信, 自媒体: weMedia
            time: 12345678921, //点击事件客户端发生时间，long 型时间戳
            "env": {
                "browser": {
                    "name": "chrome",
                    "chrome": "80.0.3987.132",
                    "type": "chrome"
                }, //浏览器信息
                "system": {
                    "name": "win",
                    "win": "10"
                }, //系统信息
                "string": "win10|chrome80.0.3987.132"
            } //环境信息
        }`,
        ...
    ]
}

各事件 json 格式

1、点击事件：
{
    event: "click",
    pageWidth: 1903, //html页面宽度，对应document.documentElement.offsetWidth
	pageHeight: 3083, //html页面高度，对应document.documentElement.offsetHeight
	screenWidth: 1920, //屏幕宽度，对应window.screen.width
	screenHeight: 1080, //屏幕高度，对应window.screen.height
	screenAvailWidth: 1920, //屏幕可用宽度，对应window.screen.availWidth
	screenAvailHeight: 1040, //屏幕可用高度，对应window.screen.availHeight
	windowInnerWidth: 1920, //窗口内部宽度，对应window.innerWidth
	windowInnerHeight: 969, //窗口内部高度，对应window.innerHeight
    position: [100, 200], //页面中的 xy 坐标，对应e.pageX和e.pageY
    targetEle: {
        nodeName: "DIV", //目标元素类型
        id: "submit", //目标元素 ID
        className: "submit-btn red", //目标元素 class
    },
    time: 12345678921, //点击事件客户端发生时间，long 型时间戳
    currentUrl: "http://www.abc.com?word=abc", //当前页面 url
    distinctId: "1123", //区分用户的 ID,第一次打开页面时新建 uuid，存放在 cookie 中
    phone: "18812345236", //用户手机号
    source: "message", //渠道来源，message:短信, 自媒体: weMedia
    "env": {
        "browser": {
            "name": "chrome",
            "chrome": "80.0.3987.132",
            "type": "chrome"
        }, //浏览器信息
        "system": {
            "name": "win",
            "win": "10"
        }, //系统信息
        "string": "win10|chrome80.0.3987.132"
    } //环境信息
}
2、页面跳转：
{
    event: "pushState",
    currentUrl: "http://www.abc.com#pageA", //从哪个页面（当前页面）跳转过去
    targetUrl: "http://www.abc.com#pageB", //跳到哪个页面
    distinctId: "1123", //区分用户的 ID,第一次打开页面时新建 uuid,存放在 cookie 中
    phone: "18812345236", //用户手机号
    source: "message", //渠道来源，message:短信, 自媒体: weMedia
    time: 12345678921, //点击事件客户端发生时间，long 型时间戳
    "env": {
        "browser": {
            "name": "chrome",
            "chrome": "80.0.3987.132",
            "type": "chrome"
        }, //浏览器信息
        "system": {
            "name": "win",
            "win": "10"
        }, //系统信息
        "string": "win10|chrome80.0.3987.132"
    } //环境信息
}
3、页面切换：
{
    event: "replaceState",
    currentUrl: "http://www.abc.com#pageA", //从哪个页面（当前页面）跳转过去
    targetUrl: "http://www.abc.com#pageB", //跳到哪个页面
    distinctId: "1123", //区分用户的 ID,第一次打开页面时新建 uuid，存放在 cookie 中
    phone: "18812345236", //用户手机号
    source: "message", //渠道来源，message:短信, 自媒体: weMedia
    time: 12345678921, //点击事件客户端发生时间，long 型时间戳
    "env": {
        "browser": {
            "name": "chrome",
            "chrome": "80.0.3987.132",
            "type": "chrome"
        }, //浏览器信息
        "system": {
            "name": "win",
            "win": "10"
        }, //系统信息
        "string": "win10|chrome80.0.3987.132"
    } //环境信息
}
4、前进后退:
{
    event: "popstate",
    currentUrl: "http://www.abc.com#pageA", //当前页面 url
    distinctId: "1123", //区分用户的 ID,第一次打开页面时新建 uuid，存放在 cookie 中
    phone: "18812345236", //用户手机号
    source: "message", //渠道来源，message:短信, 自媒体: weMedia
    time: 12345678921, //点击事件客户端发生时间，long 型时间戳
    "env": {
        "browser": {
            "name": "chrome",
            "chrome": "80.0.3987.132",
            "type": "chrome"
        }, //浏览器信息
        "system": {
            "name": "win",
            "win": "10"
        }, //系统信息
        "string": "win10|chrome80.0.3987.132"
    } //环境信息
}
5、hash 切换：
{
    event: "hashChange",
    sourceUrl: "http://www.abc.com#pageA", //从哪个页面跳转过来
    currentUrl: "http://www.abc.com#pageB", //跳到哪个页面（当前页面）
    distinctId: "1123", //区分用户的 ID,第一次打开页面时新建 uuid，存放在 cookie 中
    phone: "18812345236", //用户手机号
    source: "message", //渠道来源，message:短信, 自媒体: weMedia
    time: 12345678921, //点击事件客户端发生时间，long 型时间戳
    "env": {
        "browser": {
            "name": "chrome",
            "chrome": "80.0.3987.132",
            "type": "chrome"
        }, //浏览器信息
        "system": {
            "name": "win",
            "win": "10"
        }, //系统信息
        "string": "win10|chrome80.0.3987.132"
    } //环境信息
}
6、页面关闭后：
{
    event: "unload",
    currentUrl: "http://www.abc.com#pageA", //当前页面 url
    distinctId: "1123", //区分用户的 ID,第一次打开页面时新建 uuid，存放在 cookie 中
    phone: "18812345236", //用户手机号
    source: "message", //渠道来源，message:短信, 自媒体: weMedia
    time: 12345678921, //点击事件客户端发生时间，long 型时间戳
    "env": {
        "browser": {
            "name": "chrome",
            "chrome": "80.0.3987.132",
            "type": "chrome"
        }, //浏览器信息
        "system": {
            "name": "win",
            "win": "10"
        }, //系统信息
        "string": "win10|chrome80.0.3987.132"
    } //环境信息
}
7、页面关闭前：
{
    event: "beforeunload",
    currentUrl: "http://www.abc.com#pageB", //当前页面 url
    distinctId: "1123", //区分用户的 ID,第一次打开页面时新建 uuid，存放在 cookie 中
    phone: "18812345236", //用户手机号
    source: "message", //渠道来源，message:短信, 自媒体: weMedia
    time: 12345678921, //点击事件客户端发生时间，long 型时间戳
    "env": {
        "browser": {
            "name": "chrome",
            "chrome": "80.0.3987.132",
            "type": "chrome"
        }, //浏览器信息
        "system": {
            "name": "win",
            "win": "10"
        }, //系统信息
        "string": "win10|chrome80.0.3987.132"
    } //环境信息
}
8、页面加载:
{
    event: "load",
    currentUrl: "http://www.abc.com#pageB", //当前页面 url
    distinctId: "1123", //区分用户的 ID,第一次打开页面时新建 uuid，存放在 cookie 中
    phone: "18812345236", //用户手机号
    source: "message", //渠道来源，message:短信, 自媒体: weMedia
    time: 12345678921, //点击事件客户端发生时间，long 型时间戳
    "env": {
        "browser": {
            "name": "chrome",
            "chrome": "80.0.3987.132",
            "type": "chrome"
        }, //浏览器信息
        "system": {
            "name": "win",
            "win": "10"
        }, //系统信息
        "string": "win10|chrome80.0.3987.132"
    } //环境信息
}
9、跳转至第三方支付
{
    event: "toThirdPartyPayment",
    thirdPartyPayment: "alipay", //第三方支付类别（微信、支付宝等）
    distinctId: "1123", //区分用户的 ID,第一次打开页面时新建 uuid，存放在 cookie 中
    phone: "18812345236", //用户手机号
    source: "message", //渠道来源，message:短信, 自媒体: weMedia
    time: 12345678921, //点击事件客户端发生时间，long 型时间戳
    "env": {
        "browser": {
            "name": "chrome",
            "chrome": "80.0.3987.132",
            "type": "chrome"
        }, //浏览器信息
        "system": {
            "name": "win",
            "win": "10"
        }, //系统信息
        "string": "win10|chrome80.0.3987.132"
    } //环境信息
}
10、跳转至某外链
{
    event: "toExternalUrl",
    externalUrl: "http://www.bcd.com",
    distinctId: "1123", //区分用户的 ID,第一次打开页面时新建 uuid，存放在 cookie 中
    phone: "18812345236", //用户手机号
    source: "message", //渠道来源，message:短信, 自媒体: weMedia
    time: 12345678921, //点击事件客户端发生时间，long 型时间戳
    "env": {
        "browser": {
            "name": "chrome",
            "chrome": "80.0.3987.132",
            "type": "chrome"
        }, //浏览器信息
        "system": {
            "name": "win",
            "win": "10"
        }, //系统信息
        "string": "win10|chrome80.0.3987.132"
    } //环境信息
}
11、验证码输入正确
{
    event: "submitRightCaptcha",
    distinctId: "1123", //区分用户的 ID,第一次打开页面时新建 uuid，存放在 cookie 中
    phone: "18812345236", //用户手机号
    source: "message", //渠道来源，message:短信, 自媒体: weMedia
    time: 12345678921, //点击事件客户端发生时间，long 型时间戳
    "env": {
        "browser": {
            "name": "chrome",
            "chrome": "80.0.3987.132",
            "type": "chrome"
        }, //浏览器信息
        "system": {
            "name": "win",
            "win": "10"
        }, //系统信息
        "string": "win10|chrome80.0.3987.132"
    } //环境信息
}
12、验证码输入错误
{
    event: "submitWrongCaptcha",
    distinctId: "1123", //区分用户的 ID,第一次打开页面时新建 uuid，存放在 cookie 中
    phone: "18812345236", //用户手机号
    source: "message", //渠道来源，message:短信, 自媒体: weMedia
    time: 12345678921, //点击事件客户端发生时间，long 型时间戳
    "env": {
        "browser": {
            "name": "chrome",
            "chrome": "80.0.3987.132",
            "type": "chrome"
        }, //浏览器信息
        "system": {
            "name": "win",
            "win": "10"
        }, //系统信息
        "string": "win10|chrome80.0.3987.132"
    } //环境信息
}
13、切换验证码
{
    event: "switchCaptcha",
    distinctId: "1123", //区分用户的 ID,第一次打开页面时新建 uuid，存放在 cookie 中
    phone: "18812345236", //用户手机号
    source: "message", //渠道来源，message:短信, 自媒体: weMedia
    time: 12345678921, //点击事件客户端发生时间，long 型时间戳
    "env": {
        "browser": {
            "name": "chrome",
            "chrome": "80.0.3987.132",
            "type": "chrome"
        }, //浏览器信息
        "system": {
            "name": "win",
            "win": "10"
        }, //系统信息
        "string": "win10|chrome80.0.3987.132"
    } //环境信息
}
web-event-trackingeventtrackingweb
@infinitebrahmanuniverse/nolb-web-e@everything-registry/sub-chunk-3123
1.0.11

4 years ago

1.0.10

4 years ago

1.0.9

4 years ago

1.0.8

4 years ago

1.0.7

4 years ago

1.0.6

4 years ago

1.0.5

4 years ago

1.0.4

4 years ago

1.0.3

4 years ago

1.0.2

4 years ago

1.0.1

4 years ago

1.0.0

4 years ago