gh-qqnews-report
TypeScript icon, indicating that this package has built-in type declarations

0.3.5 • Public • Published

腾讯新闻增长技术团队的前端上报

version size

该模块是前端上报数据时使用,封装了几个方法,上传数据时调用即可。所有的数据均是上报到指定的系统中。

安装

使用 tnpm:

$ tnpm install gh-qqnews-report

使用 npm:

$ npm install gh-qqnews-report

使用 bower:

$ bower install gh-qqnews-report

使用 yarn:

$ yarn add gh-qqnews-report

使用 jsDelivr 的 CDN 地址:

<script src="https://cdn.jsdelivr.net/npm/gh-qqnews-report"></script>

使用 unpkg 的 CDN 地址:

<script src="https://unpkg.com/gh-qqnews-report"></script>

简要的使用样例:

const report = new Report({
  actid: 56, // 每个项目的actid均不相同,请向产品经理确认
});
report.send({
  pagename: 'mainpage',
  event_id: 'pv',
}); // 上报该页面的pv

document.querySelector('.button').addEventListener('click', () => {
  // 点击上报
  report.send({
    pagename: 'mainpage', // 所在的页面
    event_id: 'sop_open_click', // 触发的事件
  });
});

初始化时所需要的参数

初始化Report时要传入的参数:

参数名称 类型 是否必须 默认值 说明
actid number 项目的 id,请向产品经理确认
attaid 或 token string string 当其中一个为空时,则不向 atta 上报数据
appkey string string 当为空,则不向自定义的灯塔上报
qqnewsReport boolean true 是否使用新闻客户端的 jsapi 进行上报
eventIdPrefix string 每个上报 event_id 的前缀

该模块在用actid初始化后,默认会向阿塔系统、自定义appkey和使用新闻客户端的jspia进行上报。

方法

send()

当需要上报事件时,则调用当前方法。接收的参数类型:

interface SendProps {
  event_id: string; // 触发的事件名称
  pagename?: string; // 当前页面的名称,例如mainpage
  kv?: Object; // 非必须,其他一些额外要上传的参数,例如refer,点击的第几个item等
}

该模块仅会上传有数据的字段,若有为空的字段,则会在上传前过滤掉。

// 在mainpage中的点击上报
report.send({
  pagename: 'mainpage',
  event_id: 'sop_user_click',
});

// 根据url中的refer参数上报来源
report.send({
  pagename: 'mainpage',
  event_id: 'pv',
  kv: {
    refer: getQueryString('refer'), // 获取url中的refer参数
  },
});

// 页面中有多个排布的元素,可以上报点击的该区域内的序列
let bannerIndex = 1;
report.send({
  pagename: 'mainpage',
  event_id: 'banner',
  kv: {
    banner_index: `sop_banner${bannerIndex}_click`,
  },
});

在使用该模块时,开发者只需关心: actid, pagename, event_id 等几个关键的字段,其他的字段均是自行进行采集,开发者无需关注。

post()

send 方法默认使用的是创建一个 img 标签来进行上报的,这里还提供了一个 post 方法来进行POST方式的上报。

report.post({
  pagename: 'mainpage',
  event_id: 'sop_user_click',
});

调试

提供了debug字段开启调试功能,默认为 false(不开启)。在 send 之前将 debug 字段设置为 true 后,则会自动在页面中注入 vconsole 模块,然后显示要上传的数据:

report.debug = true;

report.send({
  pagename: 'mainpage',
  event_id: 'sop_user_click',
});

字段说明

这里面有些字段是必须要上传的,有些是多选一必传的字段(即某些场景中会上报 A 字段,其他某些场景会上报 B 字段,但 A 和 B 一定要上报其中的一个),若在上传过程中有遗漏的,则会造成统计数据的不完整。

开发者要确认的:

  • actid: 项目的 id,初始化时就要传入;
  • pagename: 当前上报页面的名称;
  • event_id: 上报事件的名称;

模块中自动采集的字段,若反馈有遗漏的字段,请联系 skeetershi 进行问题的排查:

  • type: 上报的类型,新闻客户端内为 1,新闻客户端外为 3;
  • ostype: android 系统还是 ios 系统;
  • devid, omgid, omgbizid: 在新闻客户端内要上报的数据;
  • uid: 在新闻客户端外上要上传的数据,与上面的一条互斥,但一定会上传这两条中的其中一条;
  • qqopenid: qq 登录后的账号;
  • wxopenid: 微信登录后的账号;

License

ISC

Readme

Keywords

Package Sidebar

Install

npm i gh-qqnews-report

Weekly Downloads

0

Version

0.3.5

License

ISC

Unpacked Size

61.3 kB

Total Files

45

Last publish

Collaborators

  • xiaowenzi