1. 集成 SDK

1.1. 获取引入代码

如果您当前的版本没有生成导入代码的功能,请联系神策技术支持进行升级

首先从神策分析的主页中,进入数据导入向导页面:

然后在右上角点击 数据接入 显示如下界面,然后点击 生成导入代码,进入代码生成页面,按需选择合适的选项,然后点击生成代码,如下图:

将以下上生成的代码放入 html 的 head 里面,一般最好放在稍微靠前点的位置。

1.2. 多种集成方式

将以下代码放入 html 的 head 里面,一般最好放在稍微靠前点的位置。 您在使用 sensors.track() 时,只要保证写在上面引用的代码的下面就可以,不需要等 window.onload 后再执行。

<script>
(function(para) {
	var p = para.sdk_url, n = para.name, w = window, d = document, s = 'script',x = null,y = null;
	w['sensorsDataAnalytic201505'] = n;
	w[n] = w[n] || function(a) {return function() {(w[n]._q = w[n]._q || []).push([a, arguments]);}};
	var ifs = ['track','quick','register','registerPage','registerOnce','clearAllRegister','trackSignup', 'trackAbtest', 	'setProfile','setOnceProfile','appendProfile', 'incrementProfile', 'deleteProfile', 'unsetProfile', 	'identify','login','logout','trackLink','clearAllRegister'];
	for (var i = 0; i < ifs.length; i++) {
		w[n][ifs[i]] = w[n].call(null, ifs[i]);
	}
	if (!w[n]._t) {
		x = d.createElement(s), y = d.getElementsByTagName(s)[0];
		x.async = 1;
		x.src = p;
		w[n].para = para;
		y.parentNode.insertBefore(x, y);
	}
})({
	sdk_url: '在 github 下载新版本的 sensorsdata.min.js ',
	name: 'sensors',
	server_url:'数据接收地址',
	heatmap: {
		//是否开启点击图,默认 default 表示开启,自动采集 $WebClick 事件,可以设置 'not_collect' 表示关闭
		clickmap:'default',
		//是否开启触达注意力图,默认 not_collect 表示关闭,不会自动采集 $WebStay 事件,可以设置 'default' 表示开启
		scroll_notice_map:'not_collect'
	}
}); 
sensors.quick('autoTrack'); //神策系统必须是 1.4 最新版及以上
</script>
JS

如果你需要把引入代码和 SDK 文件整合在一个文件中,然后在页面头部通过 script src 的方式引入。你可以把引入代码改成如下方式。并放在下载下来的 sensorsdata.min.js 文件前面。

<script>
    (function(para) {
      if(typeof(window['sensorsDataAnalytic201505']) !== 'undefined') {
        return false;
      }
      window['sensorsDataAnalytic201505'] = para.name;
      window[para.name] = {
        para: para
      };
  })({
      name: 'sensors',
      server_url:'数据接收地址',
      //如果神策代码中 `sensorsdata.min.js` 是 1.13.1 以前的版本,必须须配置 heatmap_url,高于此版本不需要配置。heatmap_url 神策分析中点击分析及触达分析功能代码,代码生成工具会自动生成。
      heatmap_url: "在 GitHub 下载新版本的 heatmap.min.js ",
      //如果神策后台版本及 `sensorsdata.min.js` 均是 1.10 及以上版本,不需要配置 web_url 参数。web_url 神策分析中点击分析及触达分析功能会用到此地址,代码生成工具会自动生成。
      web_url:"神策分析后台地址",
      heatmap: {
         //是否开启点击图,默认 default 表示开启,自动采集 $WebClick 事件,可以设置 'not_collect' 表示关闭
         //需要 Web JS SDK 版本号大于 1.7
         clickmap:'default',
         //是否开启触达注意力图,默认 not_collect 表示关闭,不会自动采集 $WebStay 事件,可以设置 'default' 表示开启
         //需要 Web JS SDK 版本号大于 1.9.1
         scroll_notice_map:'not_collect'
      }
    });
  </script>
<script src="在 GitHub 下载新版本的 sensorsdata.min.js"></script>
<script>
  sensors.quick('autoTrack');
</script>
JS

从 npm 获取 sdk , npm install sa-sdk-javascript

var sensors = require('sa-sdk-javascript'); 
sensors.init({
  server_url: '...',
  //如果神策代码中 `sensorsdata.min.js` 版本是 1.13.1 及以前版本,必须须配置 heatmap_url,高于此版本不需要配置。heatmap_url 神策分析中点击分析及触达分析功能代码,代码生成工具会自动生成。
  heatmap_url: "在 GitHub 下载新版本的 heatmap.min.js ",
  //如果神策后台版本及 `sensorsdata.min.js` 均是 1.10 及以上版本,这个参数不需要配置 web_url。 web_url 神策分析中点击分析及触达分析功能会用到此地址,代码生成工具会自动生成。
  web_url:"神策分析后台地址",
  heatmap: {
     //是否开启点击图,默认为 default 表示开启,自动采集 $WebClick 事件,可以设置 'not_collect' 表示关闭
     //需要 Web JS SDK 版本号大于 1.7
     clickmap:'default',
     //是否开启触达注意力图,默认 not_collect 表示关闭,不会自动采集 $WebStay 事件,可以设置 'default' 表示开启
     //需要 Web JS SDK 版本号大于 1.9.1
     scroll_notice_map:'not_collect'
  }
  .......
});
sensors.quick('autoTrack'); //用于采集 $pageview 事件
JS

GitHub 获取 sensorsdata.amd.min.js ,假设该文件放到与 require.js 同一目录中

requirejs(["./sensorsdata.amd.min"], function(sensors) {
            sensors.init({
                server_url: '...',
                heatmap:{
                    clickmap: 'default',
                    scroll_notice_map: 'not_collect'
                }
            });
            sensors.quick('autoTrack');
        });
JS

1.3. 数据接收地址 server_url 获取方式

2. 验证接入成功

2.1. 前端日志验证

  • 客户有测试项目(project=default)的情况下,优先建议客户使用测试项目的数据接收地址向测试项目发数据。
  • 页面集成 SDK 初始化代码且开启全埋点,验证数据接收地址;
  • 浏览器开发者工具 console 会打印采集的是数据,json 格式。


  • 浏览器开发者工具 network 中有 sa.gif 的图片请求,且状态码为 200,

2.2. 验证数据入库

  • 神策分析界面中,打开导入中的数据,点击开始刷新,然后在浏览器刷新页面,查看有无数据进入。如下图,则证明数据已正常入库。