0

dc-sdk-js

一个基于浏览器环境的数据采集SDK

Github 资源库
主要指标

Github星跟踪图

dc-sdk-js ——一个基于浏览器环境的数据采集SDK

功能点

  • 设备信息采集
  • 监听页面加载离开
  • 监听hash变化
  • 监听页面点击
  • 监听标签页隐藏显示
  • 轮询发送热力图采集数据
  • 轮询采集页面特定信息（以手机号为例）

以上功能都是精简后的，只作为demo展示，实际使用需要自身的业务场景酌情添加代码。

解决开发痛点

  • 用webpack打包代码，支持模块化开发
  • 用core-js提供pollyfill环境，支持es6语法
  • 用eslint+standard规范代码风格，提升代码可读性和可维护性
  • 提供了完善的测试页面，方便开发调试

浏览器支持

所有现代浏览器 和 IE8+.

技术栈思维导图

avatar

项目结构

.
+-- server            //服务端测试demo
+-- spa-angular       //angular测试demo
+-- spa-react         //react测试demo
+-- spa-vue           //vue测试demo
+-- config            //webpack配置
+-- src               //项目源码, +-- common        //通用模块, +-- config        //配置模块, +-- core          //核心模块，业务代码都在这个目录下, +-- interval  //轮询相关业务代码, +-- listener  //监听相关业务代码, +-- index.js  //入口文件, +-- params.js //封装了对请求参数的相关操作, +-- sender.js //封装了ajax和websocket请求
+-- test              //单元测试
+-- package.json

接入方式

(function() {
  var collect = document.createElement('script');
  collect.type = 'text/javascript';
  collect.async = true;
  collect.src =  '/index.js';
  var s = document.getElementsByTagName('script')[0];
  s.parentNode.insertBefore(collect, s);
})();

var _XT = [];

_XT.push(['token','custom token']);
_XT.push(['channelCode','custom channelCode']);
_XT.push(['serverUrl', 'http://localhost:8081/api'])
_XT.push(['wsUrl', 'ws://localhost:8081'])

配置说明, 字段名称, 类型, 说明, --------, :-----:, :----:, serverUrl, string, http服务端地址, wsUrl, string, websocket服务端地址, token, string, 用于服务端鉴权, channelCode, string, 用于区分不同的业务方, heatmapUrls, array, 热力图采集页面配置, heatMapDelay, string, 热力图采集数据发送时间间隔, phoneListDelay, string, 手机号轮询采集时间间隔, iframe, string, iframe地址，用于跨域共享数据, ## 采集字段说明, 字段名称, 类型, 说明, --------, :-----:, :----:, deviceType, string, 设备类型, language, string, 浏览器语言类型, screenHigh, string, 屏幕高度, screenWide, string, 屏幕宽度, type, string, 采集事件类型, currentTime, number, 当前时间戳, title, string, 当前页面标题, url, string, 当前页面URL, referrer, string, 来源页URL, data, object, 采集事件的额外信息, channelCode, string, 用于区分不同的业务方, token, string, 用于服务端鉴权, deviceId, string, 设备ID, userId, string, 用户ID, ## 安装依赖

npm install

开发环境启动

npm run dev

生产环境构建

npm run build

服务端启动

npm run server

单页应用构建

## angular
cd spa-angular
npm run build

## react
cd spa-react
npm run build

## vue
cd spa-vue
npm run build

服务端测试demo

为方便开发环境调试，我用node写了一个简易的服务端项目，其中实现了以下功能点：

  • http服务
  • websocket服务
  • 服务端渲染测试demo
  • 单页应用测试demo（包括vue、react、angular）

参考项目

License

MIT

主要指标

概览
名称与所有者drafish/dc-sdk-js
主编程语言JavaScript
编程语言JavaScript (语言数: 5)
平台
许可证
所有者活动
创建于2019-03-07 11:10:51
推送于2023-01-14 00:33:42
最后一次提交2020-01-08 11:39:03
发布数1
最新版本名称1.0.0 (发布于 )
第一版名称1.0.0 (发布于 )
用户参与
星数55
关注者数2
派生数23
提交数5
已启用问题?
问题数4
打开的问题数3
拉请求数0
打开的拉请求数46
关闭的拉请求数16
项目设置
已启用Wiki?
已存档?
是复刻?
已锁定?
是镜像?
是私有?