App内H5数据上报

重要

本文中含有需要您注意的重要提示信息,忽略该信息可能对您的业务造成影响,请务必仔细阅读。

1 H5桥接使用场景

1.1 如何将H5数据同时上报至H5应用和App应用?

场景举例:

一个“春日”活动H5嵌入在多个App端,按照当前方式操作,可以满足下述分析诉求:

  • App运营需要看到客户在App内参加H5活动前后的完整链路数据。

  • H5活动运营需要看到H5在所有App端内的活动数据。

操作说明:

  1. 创建两个应用:

  • 一个App应用,该App有自己的Appkey_app

  • 一个Web/H5应用,该Web/H5有自己的Appkey_h5

  1. 调用App内的attach接口,进行H5桥接

上报日志:

  1. App报一条日志:

    1. AppkeyApp的“Appkey_app”

    2. 用户账号为App的用户账号

    3. 设备IDApp的设备ID

    4. 系统属性为App的系统属性

    5. 全局属性是App内埋点的全局属性

    6. 事件编码和事件属性为H5内的埋点

  2. H5上报一条日志:

    1. AppkeyH5的“Appkey_h5”

    2. 用户账号为H5的用户账号

    3. 设备IDH5的设备ID

    4. 系统属性为H5的系统属性

    5. 全局属性是H5内埋点的全局属性

    6. 事件编码和事件属性为H5内的埋点

1.2 如何将H5数据仅上报至唯一App应用中?

场景举例:

由于技术架构,一部分页面为H5技术结构,按照当前方式操作,可以满足下述分析诉求:

  • App业务、运营和PD等可以在App数据内看到完整的全链路数据。

操作说明:

  1. 创建一个App应用,仅有一个Appkey_app

  2. 调用App内的attach接口,进行H5桥接

  3. H5 Appkey设置为空,并调用aplus-jsbridge-only等于true,关闭H5数据上报

上报日志:

  1. App报一条日志:

    1. AppkeyApp的“Appkey_app”

    2. 用户账号为App的用户账号

    3. 设备IDApp的设备ID

    4. 系统属性为App的系统属性

    5. 全局属性是App内埋点的全局属性

    6. 事件编码和事件属性为H5内的埋点

1.3 如果将H5数据仅上报至H5应用中?

场景举例:

  1. App业务、运营和PD等不希望在App中看到H5的数据

操作说明:

  1. 创建两个应用:

  • 一个App应用,该App有自己的Appkey_app

  • 一个Web/H5应用,该Web/H5有自己的Appkey_h5

  1. 不进行任何API的调用

上报日志:

  1. H5报一条日志:

    1. AppkeyH5的“Appkey_h5”

    2. 用户账号为H5的用户账号

    3. 设备IDH5的设备ID

    4. 系统属性为H5的系统属性

    5. 全局属性是H5内埋点的全局属性

    6. 事件编码和事件属性为H5内的埋点

2 H5桥接原理说明

yuque_diagram (2)

上述方式的前提为:

  1. App集成QuickTrackingApp SDK

  2. 以及app内的H5集成QuickTracking H5 SDK

图中表示当用户触发apph5页面上的button2时,会同时上报两条日志:

  1. 通过App SDK上报:上报的日志中,appkeyappappkey,全局属性为app的全局属性,事件编码和事件属性为h5中埋点的编码和属性。(图中绿色箭头)

  2. 通过H5 SDK上报:上报的日志中,appkeyh5appkey,全局属性为h5的全局属性,事件编码和事件属性为h5中埋点的编码和属性。(图中黄色箭头)

3 App桥接H5开关

macOS:默认关闭,只有通过设置初始化参数才能打开

// H5桥接开关
@property (nonatomic) BOOL enableJSBridge;

示例

QTSDKConfig *sdkConfig = [[QTSDKConfig alloc] initWithAppkey:@"test_appkey"
                                                  trackDomain:@"https://xxxx.com"
                                                launchOptions:nil];
// 开启H5桥接
sdkConfig.enableJSBridge = YES;
[QuickTrackingSDK launchWithConfig:sdkConfig];

4 H5 SDK上报日志开关

控制黄色箭头链路的开关API:

H5 SDK API:

SDK配置

aplus-jsbridge-only

true

关闭H5的日志发送(黄色箭头)

false(默认false)

打开H5的日志发送(黄色箭头)

aplus_queue.push({
  action: 'aplus.setMetaInfo',
  arguments: ['aplus-jsbridge-only', true]
});
警告

请注意:设置aplus-jsbridge-onlytrue之后,网页链接中的utm参数不会自动识别为渠道参数,需要开发者使用全局属性的方式自行设置。

5 H5 全局属性同步接口

H5中设置关闭下述接口后,H5中通过aplus.appendMetaInfoglobalpropertyaplus.setMetaInfoglobalproperty设置的全局属性将不会同步生效至App原生中。(该接口默认为true)

注意,该接口在qt_web_v2.0.12中支持。

aplus_queue.push({
  action: 'aplus.setMetaInfo',
  arguments: ['aplus-globalproperty-sync-enable', false] //关闭同步
});

例如:默认情况下,在App中设置全局属性「当前所在城市:北京」,在AppH5中设置全局属性「当前所在城市:上海」,则在H5App原生中触发的事件的全局属性都将为「当前所在城市:上海」。如果关闭该开关,则H5中设置的全局属性不会同步到App原生中。