Web SDK 集成文档

查看DEMO

Web SDK API 参考

更新时间:2017/6/19

JS SDK初始化

在您的页面head部分,直接引入SDK:

……
<head>
    <script src='https://sdk.appadhoc.com/ab.plus.js'></script>
    <script>
        adhoc('init', {
            appKey: 'your app key',
            defaultFlags: {isNewHomePage: false} //仅用于编程模式:设置试验变量默认值(获取试验变量失败时使用)
        })
    </script>
</head>
……

在可视化模式试验中,不需要设置变量默认值。
注意:如果没有初始化,其他 API 调用均会出错,建议在 ab.plus.js 加载之后尽快调用。

“app_key” 是在登录 AppAdhoc 后台创建“应用”之后获得的该“应用”的授权标识。

可在AppAdhoc控制台应用列表找到,如下图红线部分:

app_key

请勿在SDK基础上进行自行封装,以免影响到试验逻辑,造成试验无法正常运行。如果确有自行封装的需求,请与客户经理联系,获取注意事项。

编程模式:根据“试验变量”展示相应内容

在编程模式中“试验变量”的值决定了展示的内容或程序的逻辑。多链接试验和可视化试验不需要此步骤。

注意:试验变量值应由PM或相关A/B Testing需求制定人员在后台提前录入完毕,如下图“版本管理”红线部分:

app_key

展示相应内容需要两步:

1.获取AppAdoc 后台试验变量

通过在您的 Web 页面上调用 adhoc('getFlags', callback) 来完成的:

<button href="" onclick="adhoc('getFlags', applyFlags)">测试获得试验变量</button>

2.定义 callback 函数,在函数中根据此页面所使用的试验变量值,显示不同的页面内容。 callback 是一个 callback 函数,需要在页面代码中定义该函数,在此函数中完成模块相关的操作,模块 flags 通过函数参数传入。

……
<body>
<script>
    function applyFlags(flags) {
      if (flags.get('isNewHomePage') === true) {
        var text = " Hey,我是试验版 :) ";
      } else {
        var text = " Hey, 我是原始版本!";
      }
      document.getElementById('flags').innerHTML = text;
    }
  </script>
……

其中,'isNewHomePage' 即是“试验变量“,应与上图中红线标识保持一致,上面的示例代码在获取是否是新的首页后,操作了DOM。

请注意在用户访问到试验页面时,需要触发试验内包含的所有变量才算作进入试验,否则将不会上报试验数据。

在此示例中,“flags.get('isNewHomePage')”算作触发变量“isNewHomePage”。请勿在非试验页面或公用head模板中调用。

注意:如果网络速度较慢,在此 callback 中处理页面的展示可能会造成页面的闪烁。对于涉及到的界面变动部分,建议使用adhoc('hide')adhoc('show')方法控制元素的隐藏和展示时机。

_

上报指标

指标用于量化试验结果的好坏,AppAdhoc 后台中的试验图表根据此数据生成。在可视化试验和多链接合并试验中,您也可以通过此方法定义上报指标。

注意:指标值应由PM或相关AB Test需求制定人员在后台提前录入完毕,如下图“优化指标”红线部分:

优化指标

比如在进入某一逻辑分支后,可以统计点击次数。将上图中的指标“clickTimes”传入函数实现上报指标, 每次累加1:

<button href="" onclick="adhoc('track', 'clickTimes', 1)">统计点击次数</button>

出站链接的指标统计

针对出站链接的事件跟踪,为保证事件成功上报,请使用以下方法。此回调方法将返回指标上报是否成功的结果,您可根据返回的结果进一步处理。

<script>
var trackOutboundLink = function(url) {
  adhoc('track', 'clickTimes', 1, function(err){
       location.href = url;
   });
}
</script>

您还需要在链接中添加(或修改)onclick 属性。请使用以下示例作为自有链接的模型:

<a href="http://www.example.com" onclick="trackOutboundLink('http://www.example.com'); return false;">查看 example.com</a>

开始试验

恭喜,您完成了AppAdhoc AB Testing Web SDK的埋点集成工作,请通知PM或相关AB Test需求制定人员,点下开始试验按钮吧!

注意:确保app_key, 试验变量字符串,指标字符串与后台截图处一一对应,否则可能出现异常或无试验数据情况。

高级功能 自定义受众定向(需要联系管理员开启)

AppAdhoc Web SDK 会自动把浏览器名称、版本、语言等用户标签自动上传,开发者也可以根据需要给当前用户打上合适的自定义标签,进而实现将不符合条件的用户排除在此次试验之外。比如只想要女性用户,或30岁以下的用户参与试验等。最好在init前调用。

注意:自定义受众定向条件应由PM或相关AB Test需求制定人员在后台提前录入完毕。

在运行控制/右侧定向试验:

受众定向

选择分组,点击编辑用户群:

受众定向

即得到受众条件的key,在下图例子中,“sex”是key:

受众定向

自定义受众定向:

普通自定义:

adhoc('init', {
    init: 'your appkey',
    custom: {sex: 'male', age: '20'}
})

API 参考

Web SDK API 参考

results matching ""

    No results matching ""