nw-attribution
TypeScript icon, indicating that this package has built-in type declarations

2.15.0 • Public • Published

nw-attribution

渠道归因SDK

原理

  1. 本SDK主要是根据随机生成的uuid组成设备的唯一token(设备指纹碰撞率太高,尤其IOS端,不再计算)
  2. 再自动获取H5页面的URL中的channeluid信息,得到渠道信息和分享人信息
  3. 本SDk还会收集URL中channeluid以外的其他信息,最终结合手动传入的extraData作为全部的收集信息进行上报
  4. 提供2个方法,可以选择自动跳转到官网最新渠道包下载,也可以不下载只获取上报URL,自行处理上报逻辑

安装

$ npm install nw-attribution --save

注意事项

  • 如果要收集渠道信息,页面的URL query中需用channel设置对应的渠道信息,比如:https://www.lofter.com/test.html?channel=banner1
  • 如果URL中缺少channel字段,可以通过传入overwriteChannel字段来覆盖URL中的channel
  • 如果要收集分享人信息,页面的URL query中需用uid设置对应的分享人userId,比如:https://www.lofter.com/test.html?uid=123
  • URL中channeluid外的其他信息,也会被自动收集,作为extraData的一部分
  • 如果当前页面还有一些需要代码计算,无法固化在URL中的附加信息,可以自行收集后通过extraData上报,最终会与URL中的其他信息综合在一起,比如URL中含有testValue=1,手动传入了myUserId=2,最终会组成testValue=1&myUserId=2的上报信息
  • 因为受浏览器安全限制,想要将文本自动复制到用户剪切板,必须有用户的直接点击操作,所以必须在初始化SDk时,传入将会触发点击的DOM元素,才能利用剪切板完成本次归因信息收集
  • 页面的URL query中使用incantation设置对应的口令信息,比如:https://www.lofter.com/test.html?incantation=banner1

使用

  • es6方式引用
<button id="download">点我下载</button>
import Attributon from 'nw-attribution';
const extraData = `testValue=testKey`; // 想要额外上报的信息,字符串格式,
const btn = document.querySelector('#download');

// 初始化SDK
const attribution = new Attributon({
  button: btn,
  extraData,
})

// 直接拷贝token到剪切板并跳转上报下载url
btn.addEventListener('click', () => {
  log.sendLog('a1-1')
  // 延时300ms,并且自动上报然后跳转下载
  attribution.attributionDownload(300);
})

// 拷贝token到剪切板,传递callback获取url
btn.addEventListener('click', () => {
  attributionUrl({
    extraData,
    noDownload: true,
    callback: url => {
      console.log(url);
    }
  })
})
  • browser中直接使用(需要拷贝后bundle.js)
<script src="./bundle.js"></script>
<script>
  var btn = document.querySelector('#btn');
  var attribution = new NWAttribution.default({
    button: app
  });
  btn.addEventListener('click', function () {
    attribution.attributionDownload(300);
    console.log('click');
    // do something such as send a log
  })
  btn.addEventListener('click', () => {
    NWAttribution.attributionDownload({
      useCache: false,
      extraData: 'test=1',
      downloadTimeout: 2000
    });
    //NWAttribution.attributionUrl({
    //  useCache: true,
    //  extraData: 'test=1',
    //  callback: function (url) {
    //    console.log('url', url);
    //  }
    });
  })
</script>

发布

  1. 在根目录运行npm run build nw-attribution打包es module格式的代码
  2. 在当前packages/nw-attribution目录下运行npm run build打包UMD格式的代码
  3. 提交Git信息
  4. 在根目录运行npm run onlyPublish,发布组件更新

API

track() ⇒ Promise.<void>

Kind: global function

Versions

Current Tags

VersionDownloads (Last 7 Days)Tag
2.15.04latest

Version History

VersionDownloads (Last 7 Days)Published
2.15.04
2.14.00
2.13.00
2.12.10
2.12.00
2.11.20
2.11.11
2.11.00
2.10.10
2.10.00
2.9.00
2.8.30
2.7.00
2.2.30
2.1.00
1.32.00
1.31.00
1.30.10

Package Sidebar

Install

npm i nw-attribution

Weekly Downloads

5

Version

2.15.0

License

ISC

Unpacked Size

217 kB

Total Files

13

Last publish

Collaborators

  • luofeiyue
  • whiskeyi
  • yousy
  • guoyeeg
  • azgaga
  • liushichuan
  • yaochen
  • shenyuan
  • aflyermin
  • ignous
  • jeekdong