nw-attribution

渠道归因SDK

原理

1. 本SDK主要是根据随机生成的uuid组成设备的唯一token（设备指纹碰撞率太高，尤其IOS端，不再计算）
2. 再自动获取H5页面的URL中的channel和uid信息，得到渠道信息和分享人信息
3. 本SDk还会收集URL中channel、uid以外的其他信息，最终结合手动传入的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中channel、uid外的其他信息，也会被自动收集，作为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