前端神策埋点

日常项目开发中，涉及到一些例如支付数据，点击捕获错误等信息，埋点日志的上报是必不可少的，项目中埋点的简单封装，作以参考。

埋点安装

用的是 神策埋点平台 提供的JS SDK

pnpm install sa-sdk-javascript

参数配置

一般情况我们都在项目外层 utils文件中创建一个 sensor.js 文件，创建一个埋点实例：

import sensors from 'sa-sdk-javascript'

// 一些动态的参数需要我们和服务端商议自行填写

sensors.init({

    name: 'sensors',
    
    server_url: '', // 服务端接受数据地址
    
    show_log: false, // 不输出log到控制台

    cross_subdomain: false, // 不在根域下设置cookie
    
    is_track_single_page: true, // 表示是否开启单页面自动采集 $pageview 功能，SDK 会在 url 改变之后自动采集web页面浏览事件 $pageview。
    
    heatmap: {
    
  // 是否开启点击图，default 表示开启，自动采集 $WebClick 事件，可以设置 'not_collect' 表示关闭。
  clickmap: 'not_collect',
  
  // 是否开启触达注意力图，not_collect 表示关闭，不会自动采集 $WebStay 事件，可以设置 'default' 表示开启。
  scroll_notice_map: 'not_collect'
  
}
})

sensors.registerPage({
    current_url: location.href,
    referrer: document.referrer
})

sensors.quick('autoTrack')

window.sensors = sensors

export default sensors

进行埋点

// 调用track方法上报自定义埋点，第一个参数是自定义的事件名，第二个参数是上报的参数
    window.sensors.track("event_name", {});