方案概述

小程序与 H5 的数据打通,是小程序将匿名 ID 通过 URL 方式传递给 H5 端,H5 端替换该匿名 ID,达到统一用户标识的目的。

方案实现

小程序端

  • 调用 sa.setWebViewUrl(URL, after_hash), 拼接好包含 distinctID 的 URL,微信小程序 V1.14.12 及以上版本支持;
  • URL 参数是绑定的 web-view 的 src 属性值;
  • after_hash 参数是配置 _sasdk 参数在 URL 的 hash 部分(即 # 后部分)还是在 URL 的 search 部分(即 # 前的 ?部分, 属性值必须为布尔类型,即 true 或 false(默认 false)。
// webview.js
Page({
  data: {
    webUrl: ''
   },
  onLoad: function (options) {
    let URL = 'https://example/demo.html' 必填项
    let after_hash = true //选填项 默认 false
    this.setData({
      webUrl: getApp().sensors.setWebViewUrl(URL, after_hash)
    });
  }
});
// webview.wxml
<web-view src="{{ webUrl }}"></web-view>
CODE

H5 端

Web JS SDK 集成

H5 页面集成 Web JS SDK

开启多域名打通

参考配置如下:

sensors.use('SiteLinker',
  {linker: [
      {part_url: '', after_hash: false} 
  ]}
)
CODE

注意事项:因为涉及到多个域名页面,会产生多个匿名 ID,所以使用该多域名打通功能,建议开启多对一。

其他小程序实现方案

小程序端

小程序端一般使用 UUID 或 OpenID 作为匿名 ID ,这里以 OpenID 为例。

初始化小程序 SDK

小程序端集成 SDK 后,调用 setOpenId 将匿名 id 修改为 OpenID,并调用 init 初始化:

// 初始化 SDK
wx.request({
	url: '后端获取 OpenID 的请求',
	success: function(res){
		if(res.OpenID){
			sensors.setOpenid(res.OpenID);	
		}
	},
	complete: function(){
		sensors.init();
	}
});

web-view 传递匿名 ID 

  • 在需要跳转 H5 的小程序 Page 中获取匿名 ID 
  • 将匿名 ID 拼接到 web-view 的 src 属性上,传递给 H5
// 页面的 wxml
<web-view src={{ url }}></web-view>

//页面的 js
Page({
    data: {        
      // 跳转的 h5 的地址
      url: ''
    },
    onLoad() {     
       // 获取匿名 ID 
       var distinctID = app.sensors.getAnonymousID();
       // 更新跳转 H5 的 url
       this.setData({ 
           url: 'https://xxx.com?distinctID=' + distinctID  
       })
    }
})

H5 端

Web JS SDK 集成

H5 页面集成 Web JS SDK

替换 H5 匿名 ID

  • 判断当前页面环境,若处于小程序中,则解析页面地址中的参数,获取 distinctID 参数值
  • 调用 Web JS SDK 提供的 identify(distinctID, true) 接口修改匿名 ID
// 小程序中的 H5 页面
<script>
    // sensors.init 初始化代码
    ...
    // 自行解析 url 中携带的 distinctID
    var distinctID = getQueryString('distinctID');
    // 修改 H5 上报数据的 distinctID 
    sensors.identify(distinctID, true)
    // 再执行全埋点 autoTrack 其他操作
    ...
</script>