feat: 增加节点配置参数 (#923)

* feat: 增加节点配置参数 * feat: 增加节点配置参数 * feat: 增加节点配置参数 * feat: 增加节点配置参数 * feat: 增加节点配置参数 * feat: 增加节点配置参数 * feat: 增加节点配置参数 * feat: 增加节点配置参数 * feat: 增加节点配置参数 * feat: 增加节点配置参数 * feat: 增加节点配置参数 * feat: 增加节点配置参数 * feat: 增加节点配置参数 * feat: 优化cnzz组件 * feat: 优化cnzz组件 * feat: 优化cnzz组件 * feat: 优化cnzz组件
mipengine · Nov 28, 2017 · 96a1e0f · 96a1e0f
1 parent 87b3323
commit 96a1e0f
Show file tree

Hide file tree

Showing 4 changed files with 83 additions and 12 deletions.
diff --git a/src/mip-stats-cnzz/README.md b/src/mip-stats-cnzz/README.md
@@ -0,0 +1,44 @@
+# mip-stats-cnzz
+
+mip-stats-cnzz 用于友盟（CNZZ）统计投放。
+
+标题|内容
+----|----
+类型|通用
+支持布局|N/S
+所需脚本|https://mipcache.bdstatic.com/static/v1/mip-stats-cnzz/mip-stats-cnzz.js
+
+## 示例
+
+```html
+<mip-stats-cnzz nodes="4,6,7,8,10" token="2423211" setconfig="%5B_setAutoPageview%2C%20true%5D"></mip-stats-cnzz>
+```
+
+## 属性
+
+### token
+
+token 为站长的站点在友盟（CNZZ）上接入申请的唯一 ID。
+
+### nodes
+
+CNZZ 组件中，官方提供的是 s11 节点，但如果该节点不能满足需求时，开发者可以通过 nodes 参数自行配置节点，以节点号书写，多个节点之间通过逗号分隔，统计时将随机选择配置的节点。
+
+### setconfig
+
+setconfig 用于一些全局变量的配置，如 `[_setAutoPageview, true]`，具体参照 [CNZZ API 列表](http://open.cnzz.com/a/api/apilist/)。
+
+## CNZZ 统计事件追踪
+
+如果期望能够对统计事件进行追踪，可以通过以下方式进行设置：
+
+- 书写 mip-stats-cnzz 组件
+
+`<mip-stats-cnzz token="2423211" setconfig="全局配置"></mip-stats-bidu>`
+
+- 触发事件追踪的 dom
+
+`<div data-stats-cnzz-obj=" %7B%22type%22:%22click%22,%22data%22:%22%5B_trackPageview,%20/virtual/login%5D%22%7D ">`
+
+data-stats-cnzz-obj 配置属性格式为 `{"type":"触发机制(click点击触发/load为页面加载自动触发)","data":"[_trackPageview, /virtual/login]"}`，其中 **setconfig 与 data-stats-cnzz-obj 均需要 encodeURIComponent 转码后传入**。
+
diff --git a/src/mip-stats-cnzz/mip-stats-cnzz.js b/src/mip-stats-cnzz/mip-stats-cnzz.js
@@ -8,38 +8,60 @@
 
 define(function (require) {
     var $ = require('zepto');
-
     var customElement = require('customElement').create();
+
     customElement.prototype.build = function () {
         var element = this.element;
         var $element = $(element);
         var token = element.getAttribute('token');
         var setConfig = element.getAttribute('setconfig');
-
+        var baseUrl = getBaseUrl(element.getAttribute('nodes'));
         if (token) {
             window._czc = window._czc || [];
             _czc.push([
                 '_setAccount',
                 token
             ]);
-
             // 检测setconfig是否存在
             if (setConfig) {
                 var setCustom = buildArry(decodeURIComponent(setConfig));
                 _czc.push(setCustom);
             }
-
             var cnzzScript = document.createElement('script');
-            var src = 'https://s11.cnzz.com/z_stat.php?id=' + token
-                        + '&web_id=' + token;
+            var src = baseUrl + '?id=' + token + '&web_id=' + token;
             cnzzScript.setAttribute('language', 'JavaScript');
-            cnzzScript.src = src; 
+            cnzzScript.src = src;
             $element.append($(cnzzScript));
             bindEle();
         }
-
+        else {
+            console.error('请配置统计所需 token');
+        }
     };
 
+    // 获取 cnzz 统计的 URL
+    function getBaseUrl (src) {
+        if (!src) {
+            return getDefaultNode();
+        }
+        var nodes = src.split(',');
+        var num = getRandomNode(0, nodes.length - 1);
+        var name = nodes[num];
+        return 'https://s' + name + '.cnzz.com/z_stat.php';
+    }
+
+    // 获取默认 1-10 的 cnzz 节点
+    function getDefaultNode () {
+        return 'https://s11.cnzz.com/z_stat.php';
+    }
+
+    // 获取 min-max 之间的随机数
+    function getRandomNode (max, min) {
+        var range = max - min;
+        var rand = Math.random();
+        var num = min + Math.round(rand * range);
+        return num;
+    }
 
     // 绑定事件
     function bindEle() {
@@ -59,7 +81,7 @@ define(function (require) {
                 console.warn("事件追踪data-stats-cnzz-obj数据不正确");
                 return;
             }
-            
+
             var eventtype = statusData.type;
             if (!statusData.data) {
                 return;
@@ -109,7 +131,6 @@ define(function (require) {
         if (!arrayStr) {
             return;
         }
-
         var strArr = arrayStr.slice(1, arrayStr.length - 1).split(',');
         var newArray = [];
 
@@ -123,6 +144,5 @@ define(function (require) {
         }
         return newArray;
     }
-
     return customElement;
 });
diff --git a/src/mip-stats-cnzz/mip-stats-cnzz.less b/src/mip-stats-cnzz/mip-stats-cnzz.less
@@ -0,0 +1,6 @@
+/**
+ * @file mip-stats-cnzz样式文件
+ */
+
+mip-stats-cnzz {
+}
diff --git a/src/mip-stats-cnzz/package.json b/src/mip-stats-cnzz/package.json
@@ -1,6 +1,7 @@
 {
     "name": "mip-stats-cnzz",
-    "version": "1.0.8",
+    "version": "1.0.9",
+    "description":"mip-stats-cnzz 用于友盟（CNZZ）统计投放。",
     "author": {
         "name": "MIP authors",
         "email": "[email protected]",