H5用神策数据实现埋点(使用原生或者jq)

JavaScript012

H5用神策数据实现埋点(使用原生或者jq),第1张

1.先引入sensor.js文件

2.全局引入使用sensor

3.点击按钮进行埋点

4.在进入页面的时候会自动触发一个'pageView'事件，点击按钮会触发'webClick'事件

参考文档

javascript

wu_wen_cai原创

关注

4点赞·2951人阅读

第一步：

使用 神策 插件 npm install sa-sdk-javascript --save

第二步：

在vue项目新建文件（sensors_config.js）// 初始化埋点功能

const sensors = require('sa-sdk-javascript')

sensors.init({

show_log: true,

server_url: '#', // 神策数据接收地址

is_track_single_page: true, // 单页面配置，默认开启，若页面中有锚点设计，需要将该配置删除，否则触发锚点会多触发 $pageview 事件

use_client_time: true,

send_type: 'beacon',

heatmap: {

//是否开启点击图，default 表示开启，自动采集 $WebClick 事件，可以设置 'not_collect' 表示关闭。

clickmap: 'not_collect',

//是否开启触达图，not_collect 表示关闭，不会自动采集 $WebStay 事件，可以设置 'default' 表示开启。

scroll_notice_map: 'not_collect'

}

})

// 注册公共属性

sensors.registerPage({

user_code: '123456789', // 工号

user_name: '张三' // 姓名

})

export default sensors

第三步：

在mian.js进行导入注册

import sensors from './sensors_config'

Vue.prototype.$sensors = sensors

第四步：

在神策元数据管理中

元事件中创建埋点事件（要埋点的事件，例如：点击）

事件属性中创建属性（要传递的参数或者公共属性，例如：点击的页面）

第五步：

在项目中进行点击埋点

<template>

<div>

<el-button @click="ClickBtn">点击</el-button>

</div>

</template>

<script>

export default {

methods: {

ClickBtn() {

this.$sensors.track("cs", {

// 传递的参数

source_page: '首页' // 点击的页面

})

}

}

}

</script>

<style>

</style>

vue项目前端埋点的实现

5下载·0评论

vue 项目中神策埋点

3162阅读·1评论·3点赞

Vue项目埋点方案

138阅读·0评论·0点赞

基于Vue的数据埋点统计

1201阅读·0评论·6点赞

神策埋点测试教程（图文介绍）

43下载·0评论

vue项目中数据埋点

1472阅读·0评论·1点赞

vue前端添加埋点事件

1570阅读·0评论·1点赞

前端埋点实现方案

3271阅读·2评论·8点赞

vue项目进行数据埋点

2344阅读·0评论·0点赞

神策埋点的接入使用方法

5010阅读·2评论·2点赞

uni-App神策数据埋点引入以及使用

580阅读·0评论·0点赞

神策数据埋点实操

1662阅读·2评论·3点赞

vue自定义指令实现前端埋点+重写路由方法监听浏览时间

571阅读·0评论·1点赞

Vue前端神策数据埋点

1550阅读·0评论·1点赞

Vue项目中，webfunny前端埋点部署

646阅读·2评论·3点赞

前端vue自定义指令（directive）实现数据埋点

115阅读·0评论·0点赞

vue自定义指令实现数据埋点

313阅读·0评论·0点赞

去首页

看看更多热门内容