A小程序与B小程序相互跳转的一点记录

要点速览:

  • A小程序和B小程序关联同一个公众号
  • B程序的用户授权
  • A小程序和B小程序的用户关联
  • 诸葛 io 统计用户访问信息

需求:微信放开小程序互跳的 API 后,一些导流和拉新等活动可以在新的小程序实现

从微信官方文档中,小程序之前的互相跳转使用 wx.navigateToMiniProgram 跳转,但是最新版本使用 <navigator> 组件来使用。参考下示例 demo:

<view class="demo">
    <navigator 
        path="pages/index/index?uid={{uid}}"    // 跳转路径,可以传参
        target="miniProgram"        // 跳转目标
        app-id='wx3619c30049ec8aed' // 需要跳转的小程序ID
        version="develop"           // 当前小程序和目标小程序一致
        open-type='navigate'        // 跳转小程序
        class="demo_text">
    </navigator>
</view>

具体参考官方文档 =>
官方 navigator 文档

一、B小程序的用户授权

首先用户初次进入B程序后给一个蒙层,用户点击后主动去授权,然后拿到用户的授权信息后再进行操作,拒绝操作后蒙层不消失。
通过 wx.getUserInfo 获取用户信息,然后将临时获取的 code 值以及向量等值参数传给后端,获取到用户信息,如openId、userId 以及 token 存入全局以及缓存中,完成后重新调用 onLoad 函数 。
onLoad 函数中有一步很重要的操作就是获取 openId 来判断是否授权成功,这里我一开始是通过异步接口 wx.getstoragesync 获取,
但是部分安卓机型会第一次授权不成功,原因就在于设置缓存的时候是通过同步的方式,但是获取的时候是异步,导致偶尔获取不到,后来改成从 全局 中获取 openId 就没有这个问题了。

二、A程序和B程序的用户关联

我们的目标还是拉新和引流,所以我们需要把关联B程序的用户引入A小程序并且关联起来用户信息,
单个小程序中唯一标识是 openId ,但是多个小程序关联我们的唯一标识是 unionid ,我们授权登录的接口中,我们先调用了 wx.getUserInfo 返回的成功回调包含 iv,rawData,signature,encryptedData等字段 ,然后调用 wx.login 获取 code 再统一传入后端解密得到解密后需要的用户信息,这里rawData,signature 是来做校验的。

用户信息.png

从B程序跳入A后,我们携带B程序的 user_id 等参数,然后传入B的 user_id 以及A的 user_id 去查询库中是否存在关联的 unionid ,这里A的授权登录操作和之前一样,略过。
步骤如下:

跳入步骤.png

三、诸葛 io 统计用户访问信息

诸葛 io 类似于微信统计,都是一种埋点统计功能,我们常用的数据存储和分析载体是 事件 ,通过对用户行为的分析提供更好的服务以及实现数据驱动的精准运营。
通过安装诸葛的 sdk,然后在通过事件监听的机制了解到用户进入了哪个商品以及行为,官网的 demo 如下:

zhuge.track('进入商品详情页', {
    '商品名称' : '【联通赠费版】Apple iPhone 7 Plus 128G 黑色 移动联通电信4G手机',
    '商品价格' : 6588.00,
    '商品一级分类' : 手机,
    '商品品牌' : 'Apple'});   //属性名称不能超过255个字符,属性值不能超过200个字符

通过这种埋点统计我们很方便的可视化了解到用户的喜好和行为以及留存率等等指标,为后续的运营活动提供更精准的投放。
详情请参考=>诸葛io文档

四、A小程序跳转B小程序

从老站跳新站其实流程一样,同样需要传入老站的 user_id 去做关联操作,但是有一个不一样的是不需要授权后走关联接口,可以直接在授权的时候
将老站的 user_id 直接从登录接口中传入即可。

posted @ 2020-04-13 17:12  热爱前端知识  阅读(427)  评论(0编辑  收藏  举报