无埋点点击流技术预研

[billfeller]

研究了下 growingio.com 实现无埋点技术实现原理：

1. 通过growingio.com圈选功能： 通过iframe加载配置的页面A，在页面A中引入sdk，解决跨域问题，然后圈选指定节点，基于xpath规则获取节点标记位，如下xpath值：

{
    "domain":"test.vis.pcmgr.wsd.com",
    "page":"/",
    "xpath":"/div#root/div.screen-xl/div.ant-layout.ant-layout-has-sider/div.ant-layout-sider.sider___1tQnn/div.ant-layout-sider-children/ul.ant-menu.ant-menu-dark.ant-menu-inline.ant-menu-root/li.ant-menu-item/a"
}

2. 前端在document根结点上绑定委托click事件，当点击事件触发时，上报点击控件xpath，和一些通用的业务信息，上报匹配即可；

[
    {
        "u":"b1566605-dc90-425c-8796-a13886b8946e",
        "s":"37584b10-2aa6-4ceb-86e4-0c2983a76dcf",
        "t":"clck",
        "tm":1527751765551,
        "ptm":1527751726988,
        "d":"test.vis.pcmgr.wsd.com",
        "p":"/",
        "e":[
            {
                "h":"#/visualization",
                "v":"可视化应用",
                "x":"/div#root/div.screen-xl/div.ant-layout.ant-layout-has-sider/div.ant-layout-sider.sider___1tQnn/div.ant-layout-sider-children/ul.ant-menu.ant-menu-dark.ant-menu-inline.ant-menu-root/li.ant-menu-item.ant-menu-item-active/a",
                "idx":1
            }
        ]
    }
]

实测发现，这种实现也有一定问题，如上对于单页应用，2中，点击后多了一个 .ant-menu-item-active 类名，不知道growingio.com 是否可以匹配到对应的配置xpath节点规则~~