怎么测试集成的h5统计

H5 SDK集成

支持类型：Web、H5、App内嵌H5、小程序内嵌H5、微信端网页

产品官网地址：https://www.umeng.com/miniprogram
H5功能介绍文档：https://developer.umeng.com/docs/147615/detail/290934

适用范围
本文档适用于 aplus_cloud sdk 1.7.4及以上的版本
一、快速集成
1.1 登录

应用注册成功后，跳转到第二步SDK的安装及集成，此时会得到集成sdk所需要的appkey

1.2 集成SDK在页面head标签内加入集成代码，确保aplus_queue不被污染

<head> ... <script> (function(w, d, s, q, i) { w[q] = w[q] || []; var f = d.getElementsByTagName(s)[0],j = d.createElement(s); j.async = true; j.id = 'beacon-aplus'; j.src = 'https://d.alicdn.com/alilog/mlog/aplus/' + i + '.js'; f.parentNode.insertBefore(j, f); })(window, document, 'script', 'aplus_queue', '203467608'); //集成应用的appKey aplus_queue.push({ action: 'aplus.setMetaInfo', arguments: ['appKey', 'xxxxxxx'] }); /************************以下内容为可选配置内容****************************/ //sdk提供手动pv发送机制，启用手动pv(即关闭自动pv)，需设置aplus-waiting=MAN; //注意：由于单页面路由改变时不会刷新页面，无法自动发送pv，所以对于单页应用，强烈建议您关闭自动PV, 手动控制PV事件的发送时机N": N取值为300-3000之间的整数值 , 所有日志指令在SDK初始化完成后的N毫秒内将被hold在指令队列, 直至N毫秒等待结束；"MAN": 取消自动化PV日志采集. 设置为MAN之后, 所有PV日志均需手动触发, 但其他类型的事件日志不受影响 aplus_queue.push({ action: 'aplus.setMetaInfo', arguments: ['aplus-waiting', 'MAN'] }); //是否开启调试模式 aplus_queue.push({ action: 'aplus.setMetaInfo', arguments: ['DEBUG', true] }); //是否指定用作计算umid的id类型，默认为cnaid，目前支持: //1. 微信\QQ openid, 字节、百度 anonymousid, 支付宝 alipay_id //2. 微信、QQ、字节、百度平台的 unionid //3. 业务方自己生成的随机id uuid aplus_queue.push({ action: 'aplus.setMetaInfo', arguments: ['aplus-idtype', 'xxxx'] //取值参考见附表1 }); //设置userid aplus_queue.push({ action: 'aplus.setMetaInfo', arguments: ['_user_id', 'xxxx'] //值为业务自定义的登录账号ID }); /******************************************************************/ </script> </head>
在完成前步骤之后，您就可以开始在应用工程开始埋点了。

二、事件埋点
2.1 SDK设置2.1.1 setMetaInfo用于变更SDK的默认设置

const {aplus_queue} = window; aplus_queue.push({ action: 'aplus.setMetaInfo', arguments: [metaName, metaValue, mode] });
其中：

• metaName 为可配置的元数据项，可配置的 meta项见下文列表
• metaValue 为对应的元配置项取值
• mode 为模式，其取值为枚举值：
• "OVERWRITE": 覆盖模式，原 meta 值将直接被覆盖，注意对于取值为单值的 meta 只有覆盖模式
• 默认值
• "APPEND": 追加模式，仅适用于 meta 取值为数组对象的 meta，追加模式下原取值保留

2.1.2 getMetaInfo用于动态获取 SDK 的当前配置

aplus.getMetaInfo(metaName);
目前支持的 metaName 及 metaValue见，附表1
2.2 异步上报有些信息如用户id、用户昵称等是异步获取的，这种情况下如果您需要等待异步信息获取成功后再上报日志，sdk这边提供了设置元配置信息_hold = BLOCK 来阻塞上报，再时机成熟时通过更新元配置信息_hold=START来开启上报

const {aplus_queue} = window; //如采集用户信息是异步行为，需要先阻止SDK上报，设置BLOCK埋点 aplus_queue.push({ action: 'aplus.setMetaInfo', arguments: ['_hold', 'BLOCK'] }); //异步耗时流程 (如获取user_id) aplus_queue.push({ action: 'aplus.setMetaInfo', arguments: ['_user_id', 'test_user_id'] }); // 因为采集用户信息是异步行为，故需要先设置BLOCK，再设置START // 设置_hold=START后，事先被block住的日志会携带上用户信息逐条发出 aplus_queue.push({ action: 'aplus.setMetaInfo', arguments: ['_hold', 'START'] });

2.3 页面曝光事件sendPVsendPV 方法将发送一条页面 PV 日志，其 API 定义如下：

const {aplus_queue} = window; aplus_queue.push({ action: 'aplus.sendPV', arguments: [{is_auto: false}] });
效果如：

警告 ：sdk 默认提供自动pv的能力；但若metaInfo配置信息中aplus-waiting等于MAN时，此时pv的发送时机改为由开发者自己控制，特别是当您的H5应用是一个单页应用时，您必须通过调用sendPV来发送页面曝光事件；pv事件一定要发送，否则影响新增、活跃、分享回流等指标的计算！！

2.4 页面点击事件recordrecord 用于发送一条事件日志，其 API 定义如下：

const {aplus_queue} = window; aplus_queue.push({ action: 'aplus.record', arguments: [eventCode, eventType, eventParams] });
其中，

• eventCode：事件ID 或 事件编码，字符串类型
• eventType：'CLK'
• eventParams 为本次事件中上报的事件参数。其取值为一个JSON对象（平铺的简单对象，不能多层嵌套）
• 调用 record api 上报参数时，该次赋值仅对该条事件有效
• SDK保留属性：uid, aplus, spm-url, spm-pre, spm-cnt, pvid,dev_id,anony_id,user_id,user_nick, _session_id

const {aplus_queue} = window; //一个简单的demo aplus_queue.push({ action: 'aplus.record', arguments: ['yourTrackerEventCode', 'CLK', { param1: '111', param2: '222', param3: 333 }] });
效果如下：

2.5 预制元素事件2.5.1 手动曝光借用record API的能力，当事件id为$$_exposure时，事件被统计为预制元素曝光事件，支持聚合上报和单独上报待曝光元素的id

注意 待曝光元素key为字符串类型， 取值value为字符串或Number类型，长度均限制为128位字符以内；如果聚合上报，最多支持100个key
API调用方式如下：

const {aplus_queue} = window; //一个简单的demo aplus_queue.push({ action: 'aplus.record', arguments: ['$$_exposure', 'EXP', { //key为字符串类型, value为字符串或Number类型，长度均限制在128位字符以内 id1: "testItemId1", id2: "testItemId2", id3: "testItemId3" }] });
效果图如下：

2.5.2 自动曝光通过手动曝光的方式，开发者需要自己考虑元素曝光的时机，为了方便开发者使用曝光功能，sdk增加了元素自动曝光的能力，开发者需修改DOM元素配置如下：

• 配置待曝光元素的class
• 配置待曝光元素需携带的自定义参数，需使用数据属性data-xxx模式

<body> ... <div class="parent"> <div class="auto-exp-component" data-itemid="test_exp_id"> 自动曝光元素，无需点击 </div> </div> ... </body>
同时为了识别需要曝光的元素，sdk 需要增加如下配置：

const { aplus_queue } = window; aplus_queue.push({ action: 'aplus.setMetaInfo', arguments: ['aplus-auto-exp', [ { // 需要曝光的元素class cssSelector: '.auto-exp-component', //如果页面模块是元素内滚动（某个区块内有滚动条）则需要增加positionSelector辅助定位曝光元素 positionSelector: '.parent', logkey: 'test_event_id', //事件管理中的事件id props: ['data-itemid'], // 你要曝光的元素身上自定义属性 }, ... ], ], });

注意 注意：1. 自动曝光默认规则是符合埋点选择器的模块的30%面积出现在视口内达到500ms，如果存在浮层层叠也依然会上报；2.如果页面模块是元素内滚动（某个区块内有滚动条）则需要增加positionSelector辅助定位曝光元素
效果如下：